From 380e787065891d552753244b6d5c49d23b9f3d40 Mon Sep 17 00:00:00 2001
From: Pavel Feldman <pavel.feldman@gmail.com>
Date: Fri, 10 Jun 2022 16:34:21 -0800
Subject: [PATCH] fix(ct): respect boolean shorthands (#14798)

---
 packages/playwright-test/src/transform.ts     |  2 +-
 packages/playwright-test/src/tsxTransform.ts  |  2 ++
 .../playwright.ct-react.spec.ts               | 24 +++++++++++++++++++
 3 files changed, 27 insertions(+), 1 deletion(-)

diff --git a/packages/playwright-test/src/transform.ts b/packages/playwright-test/src/transform.ts
index 4592462f78..3afee40c80 100644
--- a/packages/playwright-test/src/transform.ts
+++ b/packages/playwright-test/src/transform.ts
@@ -26,7 +26,7 @@ import { tsConfigLoader } from './third_party/tsconfig-loader';
 import Module from 'module';
 import type { BabelTransformFunction } from './babelBundle';
 
-const version = 11;
+const version = 12;
 const cacheDir = process.env.PWTEST_CACHE_DIR || path.join(os.tmpdir(), 'playwright-transform-cache');
 const sourceMaps: Map<string, string> = new Map();
 
diff --git a/packages/playwright-test/src/tsxTransform.ts b/packages/playwright-test/src/tsxTransform.ts
index 728d7205ea..f635ab6df0 100644
--- a/packages/playwright-test/src/tsxTransform.ts
+++ b/packages/playwright-test/src/tsxTransform.ts
@@ -91,6 +91,8 @@ export default declare((api: BabelAPI) => {
               props.push(t.objectProperty(t.stringLiteral(attrName), jsxAttribute.value));
             else if (t.isJSXExpressionContainer(jsxAttribute.value) && t.isExpression(jsxAttribute.value.expression))
               props.push(t.objectProperty(t.stringLiteral(attrName), jsxAttribute.value.expression));
+            else if (jsxAttribute.value === null)
+              props.push(t.objectProperty(t.stringLiteral(attrName), t.booleanLiteral(true)));
             else
               props.push(t.objectProperty(t.stringLiteral(attrName), t.nullLiteral()));
           } else if (t.isJSXSpreadAttribute(jsxAttribute)) {
diff --git a/tests/playwright-test/playwright.ct-react.spec.ts b/tests/playwright-test/playwright.ct-react.spec.ts
index 539a609fb6..2fd9496aa7 100644
--- a/tests/playwright-test/playwright.ct-react.spec.ts
+++ b/tests/playwright-test/playwright.ct-react.spec.ts
@@ -297,3 +297,27 @@ test('should return root locator for fragments', async ({ runInlineTest }) => {
   expect(result.exitCode).toBe(0);
   expect(result.passed).toBe(1);
 });
+
+test('should respect default property values', async ({ runInlineTest }) => {
+  const result = await runInlineTest({
+    'playwright/index.html': `<script type="module" src="/playwright/index.ts"></script>`,
+    'playwright/index.ts': `//@no-header`,
+    'src/label.tsx': `//@no-header
+      export const Label = ({ checked }) => <div>type:{typeof checked} value:{String(checked)}</div>;
+    `,
+
+    'src/label.test.tsx': `
+      //@no-header
+      import { test, expect } from '@playwright/experimental-ct-react';
+      import { Label } from './label';
+
+      test('boolean shorthand', async ({ mount }) => {
+        const component = await mount(<Label checked></Label>);
+        await expect(component).toHaveText('type:boolean value:true');
+      });
+    `,
+  }, { workers: 1 });
+
+  expect(result.exitCode).toBe(0);
+  expect(result.passed).toBe(1);
+});