Merge branch 'getgrit:main' into main

Author: scr2em

.grit/patterns/css/aspect_ratio.md

@@ -2,8 +2,6 @@
 title: Aspect ratio
 ---
 
-# {{ page.title }}
-
 ```grit
 language css
 

.grit/patterns/go/cloudflare_go_v2.md

@@ -11,6 +11,13 @@ Future migrations will be more seamless as we will be automatically generating t
 {% /note %}
 
 
+This migration can be applied automatically using the [Grit CLI](https://docs.grit.io/cli/quickstart):
+
+```
+grit apply cloudflare_go_v2
+```
+
+
 ```grit
 language go
 
@@ -651,12 +658,6 @@ file($body) where {
 }
 ```
 
-This migration can be applied automatically using the [Grit CLI](https://docs.grit.io/cli/quickstart):
-
-```
-grit apply cloudflare_go_v2
-```
-
 ## Client construction with API key and email
 
 Old:

.grit/patterns/java/no_big_decimal_double.md

@@ -1,10 +1,8 @@
 ---
-title: "BigDecimal(double)" should not be used
+title: "`BigDecimal(double)` should not be used"
 tags: [java]
 ---
 
-# "BigDecimal(double)" should not be used
-
 Because of floating point imprecision, the `BigDecimal(double)` constructor can be somewhat unpredictable. It is better to use `BigDecimal.valueOf(double)`.
 
 

.grit/patterns/js/codecept_to_playwright.md

@@ -1,5 +1,6 @@
 ---
 title: Convert CodeceptJS to Playwright
+tags: [migration]
 ---
 
 Migrate from CodeceptJS to Playwright.
@@ -17,7 +18,7 @@ predicate convert_tags($scenario, $description) {
           $tags += `@$fragment`,
       },
     },
-  
+
     $tags = join($tags, ` `),
     $description => trim(`$description $tags`, " "),
 }

.grit/patterns/js/curly.md

@@ -37,7 +37,7 @@ if (x > 0) {
 }
 ```
 
-##else 
+## else 
 ```js 
 if (x > 0)
   doStuff();

.grit/patterns/js/cypress_to_playwright.md

@@ -1,6 +1,6 @@
 ---
 title: Convert Cypress to Playwright
-tags: [hidden]
+tags: [migration]
 ---
 
 Migrate from Cypress to Playwright.
@@ -13,38 +13,88 @@ pattern convert_cypress_assertions() {
     or {
         `expect($arg).to.not.be.null` => `expect($arg).not.toBeNull()`,
         `expect($arg).to.not.be.undefined` => `expect($arg).not.toBeUndefined()`,
+        `expect($arg).to.include($item)` => `expect($arg).toContain($item)`,
+        `expect($arg).to.eql($item)` => `expect($arg).toEqual($item)`,
+        `$locator.should($cond1, $cond2)` as $should where {
+            $pw_cond = "",
+            $cond1 <: or {
+                `'contain'` where {
+                    $pw_cond += `toContainText($cond2)`,
+                },
+                `'have.attr'` where {
+                    $pw_cond += `toHaveAttribute($cond2)`,
+                },
+            },
+            $should => `await expect($locator).$pw_cond`,
+        },
         `$locator.should($condition)` as $should where {
             $condition <: bubble or {
                 `'exist'` => `toBeAttached()`,
                 `'not.exist'` => `not.toBeAttached()`,
             },
             $should => `await expect($locator).$condition`,
         },
-        `$locator.should($cond1, $cond2)` as $should where {
-            $pw_cond = "",
-            $cond1 <: `'contain'` where {
-                $pw_cond += `toContainText($cond2)`,
-            },
-            $should => `await expect($locator).$pw_cond`,
-        }
     }
 }
 
 pattern convert_cypress_queries() {
     or {
         `cy.visit($loc)` => `await page.goto($loc)`,
         `cy.get($locator)` => `page.locator($locator)`,
+        `cy.contains($text, $options)` => `await expect(page.getByText($text)).toBeVisible($options)`,
+        `cy.get($locator).contains($text).$action()` => `await page.locator($locator, { hasText: $text }).$action()`,
+        `cy.get($locator).contains($text)` => `page.locator($locator, { hasText: $text })`,
+        `cy.contains($text)` => `await expect(page.getByText($text)).toBeVisible()`,
         `cy.log($log)` => `console.log($log)`,
+        `cy.wait($timeout)` => `await page.waitForTimeout($timeout)`,
+        `$locator.find($inner)` => `$locator.locator($inner)`,
+        `$locator.eq($n)` => `$locator.nth($n)`,
+        `$locator.click($opts)` => `await $locator.click($opts)`,
+        `$locator.text()` => `await $locator.textContent()`,
         `Cypress.env('$var')` => `process.env.$var`,
         `cy.onlyOn($var === $cond)` => `if ($var !== $cond) {
   test.skip();
 }`,
+        `cy.$_($selector).each(($locator) => {
+            $body
+        })` as $loop where {
+            $var = `$[locator]s`,
+            $loop => `const $var = await page.locator($selector).all();
+for (const $locator of $var) {
+    $body
+}`
+        },
+        `cy.request({ $opts })` as $req where {
+            or {
+                $opts <: contains pair(key=`method`, value=`"$method"`),
+                $method = `get`,
+            },
+            $opts <: contains pair(key=`url`, value=$url),
+            $method = lowercase($method),
+            $other_opts = [],
+            $opts <: some bubble($other_opts) $opt where {
+                $opt <: not contains or {
+                    `method`,
+                    `url`,
+                },
+                $other_opts += $opt,
+            },
+            $other_opts = join($other_opts, `,`),
+            $req => `await request.$method($url, { $other_opts })`
+        }
     }
 }
 
 pattern convert_cypress_test() {
     or {
-        `describe($description, $suite)` => `test.describe($description, $suite)`,
+        `describe($description, $suite)` => `test.describe($description, $suite)` where {
+            $suite <: maybe contains bubble or {
+                `before($hook)` => `test.beforeAll(async $hook)`,
+                `beforeEach($hook)` => `test.beforeEach(async $hook)`,
+                `after($hook)` => `test.afterAll(async $hook)`,
+                `afterEach($hook)` => `test.afterEach(async $hook)`,
+            },
+        },
         or {
             `it($description, () => { $body })`,
             `test($description, () => { $body })`
@@ -58,7 +108,7 @@ contains bubble or {
     convert_cypress_assertions(),
     convert_cypress_queries(),
 } where {
-    $program <: contains bubble convert_cypress_test(),
+    $program <: maybe contains bubble convert_cypress_test(),
     $expect = `expect`,
     $expect <: ensure_import_from(source=`"@playwright/test"`),
     $test = `test`,
@@ -93,3 +143,90 @@ test.describe('A mock test', () => {
   });
 });
 ```
+
+## Converts requests
+
+```js
+cy.request({
+  method: 'POST',
+  url: '/submit',
+  body: JSON.stringify({
+    content: 'Hello world',
+  }),
+  failOnStatusCode: false,
+});
+cy.contains('Submitted', { timeout: 10000 });
+```
+
+```ts
+import { expect, test } from '@playwright/test';
+
+await request.post('/submit', {
+  body: JSON.stringify({
+    content: 'Hello world',
+  }),
+  failOnStatusCode: false,
+});
+await expect(page.getByText('Submitted')).toBeVisible({ timeout: 10000 });
+```
+
+## Converts hooks
+
+```js
+describe('Grouping', function () {
+  before(function () {
+    setup();
+  });
+
+  afterEach(function () {
+    cy.wait(1000);
+    teardown();
+  });
+});
+```
+
+```ts
+import { expect, test } from '@playwright/test';
+
+test.describe('Grouping', function () {
+  test.beforeAll(async function () {
+    setup();
+  });
+
+  test.afterEach(async function () {
+    await page.waitForTimeout(1000);
+    teardown();
+  });
+});
+```
+
+## Converts composite queries
+
+```js
+describe('Grouping', function () {
+  it('my test', async () => {
+    cy.get('.header').find('.button').eq(1).click({ force: true });
+    cy.get('.sidebar').contains('Files').click();
+    cy.get('.header').find('.button').eq(1).should('have.attr', 'disabled');
+    cy.get('.button').each((button) => {
+      expect(button.text()).to.eql('Submit');
+    });
+  });
+});
+```
+
+```ts
+import { expect, test } from '@playwright/test';
+
+test.describe('Grouping', function () {
+  test('my test', async ({ page, request }) => {
+    await page.locator('.header').locator('.button').nth(1).click({ force: true });
+    await page.locator('.sidebar', { hasText: 'Files' }).click();
+    await expect(page.locator('.header').locator('.button').nth(1)).toHaveAttribute('disabled');
+    const buttons = await page.locator('.button').all();
+    for (const button of buttons) {
+      expect(await button.textContent()).toEqual('Submit');
+    }
+  });
+});
+```

.grit/patterns/js/intelligent_useEffect_to_useLayoutEffect.md

@@ -1,5 +1,5 @@
 ---
-title: [React2Hooks] Intelligent useEffect vs useLayoutEffect
+title: "[React2Hooks] Intelligent useEffect vs useLayoutEffect"
 tags: [fix]
 ---
 

.grit/patterns/js/no_return_assign.md

@@ -3,10 +3,9 @@ title: Hoist assignment out of `return` statement
 tags: [good, se]
 ---
 
-# {{ page.title }}
-
-This rule hoists the assignments out of `return`. Does not apply when assignment is wrapped in parentheses.
+This rule hoists the assignments out of `return`. Because an assignment, `=` is easy to confuse with a comparison, `==`, The best practice is not to use any assignments in return statements.
 
+This does not apply when assignment is wrapped in parentheses.
 
 ```grit
 engine marzano(0.1)
@@ -21,10 +20,6 @@ language js
 } => `$assignment;\n  return $left;`
 ```
 
-```
-An assignment, `=`, is easy to confuse with a comparison, `==`. The best practice is not to use any assignments in return statements.
-```
-
 ## Hoist `=` from `return` statement
 
 ```javascript

.grit/patterns/js/no_unsafe_negation.md

@@ -3,8 +3,6 @@ title: Rewrite `!key in col` ⇒ `!(key in col)`
 tags: [fix]
 ---
 
-# {{ page.title }}
-
 Negates `key` instead of the entire expression, which is likely a bug.
 
 The intent is usually to negate the entire relation expression.

.grit/patterns/js/prefer_early_return.md

@@ -3,8 +3,6 @@ title: PreferEarlyReturn
 tags: [lint, style]
 ---
 
-# {{ page.title }}
-
 Prefer to use early returns to keep functions flat.