makeTemplate test util (#2281)

* makeTemplate test util

* rename things

* fmt

* doc string

* clean up

e2e/playwright/flow-tests.spec.ts

@@ -1,5 +1,5 @@
 import { test, expect } from '@playwright/test'
-import { getUtils } from './test-utils'
+import { makeTemplate, getUtils } from './test-utils'
 import waitOn from 'wait-on'
 import { roundOff } from 'lib/utils'
 import { SaveSettingsPayload } from 'lib/settings/settingsTypes'
@@ -1689,14 +1689,13 @@ test('Sketch on face', async ({ page }) => {
   await expect(page.locator('.cm-content')).not.toHaveText(previousCodeContent)
   previousCodeContent = await page.locator('.cm-content').innerText()
 
-  await expect(page.locator('.cm-content'))
-    .toContainText(`const part002 = startSketchOn(part001, 'seg01')
-|> startProfileAt([-12.83, 6.7], %)
-|> line([${process?.env?.CI ? 2.28 : 2.28}, -${
-    process?.env?.CI ? 0.07 : 0.07
-  }], %)
-|> line([-3.05, -1.47], %)
-|> close(%)`)
+  const result = makeTemplate`const part002 = startSketchOn(part001, 'seg01')
+  |> startProfileAt([-12.83, 6.7], %)
+  |> line([${[2.28, 2.35]}, -${0.07}], %)
+  |> line([-3.05, -1.47], %)
+  |> close(%)`
+
+  await expect(page.locator('.cm-content')).toHaveText(result.regExp)
 
   // exit sketch
   await u.openAndClearDebugPanel()
@@ -1715,15 +1714,9 @@ test('Sketch on face', async ({ page }) => {
   await expect(page.getByText('Confirm Extrude')).toBeVisible()
   await page.keyboard.press('Enter')
 
-  await expect(page.locator('.cm-content'))
-    .toContainText(`const part002 = startSketchOn(part001, 'seg01')
-|> startProfileAt([-12.83, 6.7], %)
-|> line([${process?.env?.CI ? 2.28 : 2.28}, -${
-    process?.env?.CI ? 0.07 : 0.07
-  }], %)
-|> line([-3.05, -1.47], %)
-|> close(%)
-|> extrude(5 + 7, %)`)
+  const result2 = result.genNext`
+  |> extrude(${[5, 5]} + 7, %)`
+  await expect(page.locator('.cm-content')).toHaveText(result2.regExp)
 })
 
 test('Can code mod a line length', async ({ page }) => {

e2e/playwright/test-utils.ts

@@ -182,3 +182,76 @@ export function getUtils(page: Page) {
       }),
   }
 }
+
+type TemplateOptions = Array<number | Array<number>>
+
+type makeTemplateReturn = {
+  regExp: RegExp
+  genNext: (
+    templateParts: TemplateStringsArray,
+    ...options: TemplateOptions
+  ) => makeTemplateReturn
+}
+
+const escapeRegExp = (string: string) => {
+  return string.replace(/[.*+?^${}()|[\]\\]/g, '\\$&') // $& means the whole matched string
+}
+
+const _makeTemplate = (
+  templateParts: TemplateStringsArray,
+  ...options: TemplateOptions
+) => {
+  const length = Math.max(...options.map((a) => (Array.isArray(a) ? a[0] : 0)))
+  let reExpTemplate = ''
+  for (let i = 0; i < length; i++) {
+    const currentStr = templateParts.map((str, index) => {
+      const currentOptions = options[index]
+      return (
+        escapeRegExp(str) +
+        String(
+          Array.isArray(currentOptions)
+            ? currentOptions[i]
+            : typeof currentOptions === 'number'
+            ? currentOptions
+            : ''
+        )
+      )
+    })
+    reExpTemplate += '|' + currentStr.join('')
+  }
+  return new RegExp(reExpTemplate)
+}
+
+/**
+ * Tool for making templates to match code snippets in the editor with some fudge factor,
+ * as there's some level of non-determinism.
+ *
+ * Usage is as such:
+ * ```typescript
+ * const result = makeTemplate`const myVar = aFunc(${[1, 2, 3]})`
+ * await expect(page.locator('.cm-content')).toHaveText(result.regExp)
+ * ```
+ * Where the value `1`, `2` or `3` are all valid and should make the test pass.
+ *
+ * The function also has a `genNext` function that allows you to chain multiple templates
+ * together without having to repeat previous parts of the template.
+ * ```typescript
+ * const result2 = result.genNext`const myVar2 = aFunc(${[4, 5, 6]})`
+ * ```
+ */
+export const makeTemplate: (
+  templateParts: TemplateStringsArray,
+  ...values: TemplateOptions
+) => makeTemplateReturn = (templateParts, ...options) => {
+  return {
+    regExp: _makeTemplate(templateParts, ...options),
+    genNext: (
+      nextTemplateParts: TemplateStringsArray,
+      ...nextOptions: TemplateOptions
+    ) =>
+      makeTemplate(
+        [...templateParts, ...nextTemplateParts] as any as TemplateStringsArray,
+        [...options, ...nextOptions] as any
+      ),
+  }
+}