CI check against prod bundle

.eslintignore

@@ -8,4 +8,5 @@
 **/*.d.ts
 **/playwright*/**
 **/vite.config.js
+**/vite.prod.config.js
 **/node_modules

.github/workflows/test.yml

@@ -310,3 +310,85 @@ jobs:
           name: Test Results
           path: test-results/
           retention-days: 7
+
+  e2e-prod:
+    runs-on: macos-latest
+    strategy:
+      matrix:
+        node-version: [16.8]
+        browser: ['chromium']
+        editor-mode: ['rich-text', 'plain-text']
+        events-mode: ['modern-events']
+    env:
+      CI: true
+      E2E_EDITOR_MODE: ${{ matrix.editor-mode }}
+      E2E_EVENTS_MODE: ${{ matrix.events-mode }}
+    steps:
+      - uses: actions/checkout@v3
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ matrix.node-version }}
+      - run: npm i -g npm@8
+      - uses: actions/cache@v3
+        id: cache
+        with:
+          path: |
+            node_modules
+            packages/playwright-core/node_modules
+            ~/Library/Caches/ms-playwright
+          key: ${{ runner.os }}-v${{ secrets.CACHE_VERSION }}-${{ hashFiles('package-lock.json') }}
+      - name: Install dependencies
+        if: steps.cache.outputs.cache-hit != 'true'
+        run: npm ci
+      - name: Download browsers
+        run: npx playwright install
+      - run: npm run test-e2e-prod-ci:${{ matrix.browser }}
+      - name: Upload Artifacts
+        if: failure()
+        uses: actions/upload-artifact@v3
+        with:
+          name: Test Results
+          path: test-results/
+          retention-days: 7
+
+  e2e-collab-prod:
+    runs-on: macos-latest
+    strategy:
+      matrix:
+        node-version: [16.8]
+        browser: ['chromium']
+        editor-mode: ['rich-text']
+        events-mode: ['modern-events']
+    env:
+      CI: true
+      E2E_EDITOR_MODE: ${{ matrix.editor-mode }}
+      E2E_EVENTS_MODE: ${{ matrix.events-mode }}
+    steps:
+      - uses: actions/checkout@v3
+      - name: Use Node.js ${{ matrix.node-version }}
+        uses: actions/setup-node@v3
+        with:
+          node-version: ${{ matrix.node-version }}
+      - run: npm i -g npm@8
+      - uses: actions/cache@v3
+        id: cache
+        with:
+          path: |
+            node_modules
+            packages/playwright-core/node_modules
+            ~/Library/Caches/ms-playwright
+          key: ${{ runner.os }}-v${{ secrets.CACHE_VERSION }}-${{ hashFiles('package-lock.json') }}
+      - name: Install dependencies
+        if: steps.cache.outputs.cache-hit != 'true'
+        run: npm ci
+      - name: Download browsers
+        run: npx playwright install
+      - run: npm run test-e2e-collab-prod-ci:${{ matrix.browser }}
+      - name: Upload Artifacts
+        if: failure()
+        uses: actions/upload-artifact@v3
+        with:
+          name: Test Results
+          path: test-results/
+          retention-days: 7

.prettierignore

@@ -7,6 +7,7 @@ packages/**/config/*.js
 packages/playwright
 packages/playwright-core
 packages/**/vite.config.js
+packages/**/vite.prod.config.js
 **/*.md
 **/node_modules
 flow-typed

package.json

@@ -15,9 +15,11 @@
   "scripts": {
     "start": "cross-env NODE_ENV=development concurrently \"npm:collab\" \"npm run dev --prefix packages/lexical-playground\"",
     "start:website": "npm run start --prefix packages/lexical-website-new -- --port 3001",
+    "start:playground": "serve packages/lexical-playground/build -l 4000",
     "dev": "npm run dev --prefix packages/lexical-playground",
     "build": "node scripts/build.js",
     "build-prod": "npm run clean && npm run build -- --prod",
+    "build-playground-prod": "npm run build-prod && npm run build-prod --prefix packages/lexical-playground",
     "build-release": "npm run build-prod -- --release",
     "build-www": "npm run clean && npm run build -- --www && npm run build -- --www --prod && npm run prepare-www",
     "clean": "node scripts/clean.js",
@@ -40,15 +42,20 @@
     "test-e2e-collab:chromium": "cross-env E2E_BROWSER=chromium E2E_EDITOR_MODE=rich-text-with-collab playwright test --project=\"chromium\"",
     "test-e2e-collab:firefox": "cross-env E2E_BROWSER=firefox E2E_EDITOR_MODE=rich-text-with-collab playwright test --project=\"firefox\"",
     "test-e2e-collab:webkit": "cross-env E2E_BROWSER=webkit E2E_EDITOR_MODE=rich-text-with-collab playwright test --project=\"webkit\"",
+    "test-e2e-prod:chromium": "cross-env E2E_BROWSER=chromium E2E_PORT=4000 playwright test --project=\"chromium\"",
+    "test-e2e-collab-prod:chromium": "cross-env E2E_BROWSER=chromium E2E_PORT=4000 E2E_EDITOR_MODE=rich-text-with-collab playwright test --project=\"chromium\"",
     "test-e2e-ci:chromium": "cross-env E2E_PORT=4000 start-server-and-test prepare-ci 4000 test-e2e:chromium",
     "test-e2e-ci:firefox": "cross-env E2E_PORT=4000 start-server-and-test prepare-ci 4000 test-e2e:firefox",
     "test-e2e-ci:webkit": "cross-env E2E_PORT=4000 start-server-and-test prepare-ci 4000 test-e2e:webkit",
     "test-e2e-collab-ci:chromium": "cross-env E2E_PORT=4000 start-server-and-test prepare-ci-collab 4000 test-e2e-collab:chromium",
     "test-e2e-collab-ci:firefox": "cross-env E2E_PORT=4000 start-server-and-test prepare-ci-collab 4000 test-e2e-collab:firefox",
     "test-e2e-collab-ci:webkit": "cross-env E2E_PORT=4000 start-server-and-test prepare-ci-collab 4000 test-e2e-collab:webkit",
+    "test-e2e-prod-ci:chromium": "cross-env E2E_PORT=4000 start-server-and-test prepare-ci-prod 4000 test-e2e-prod:chromium",
+    "test-e2e-collab-prod-ci:chromium": "cross-env E2E_PORT=4000 start-server-and-test prepare-ci-collab-prod 4000 test-e2e-collab-prod:chromium",
     "run-all": "npm-run-all debug-test-e2e:*",
     "debug-test-e2e": "cross-env playwright test --debug",
     "debug-test-e2e:chromium": "cross-env E2E_BROWSER=chromium playwright test --debug --project=\"chromium\"",
+    "debug-test-e2e-prod:chromium": "cross-env E2E_BROWSER=chromium E2E_PORT=4173 playwright test --debug --project=\"chromium\"",
     "debug-test-e2e:firefox": "cross-env E2E_BROWSER=firefox playwright test --debug --project=\"firefox\"",
     "debug-test-e2e:webkit": "cross-env E2E_BROWSER=webkit playwright test --debug --project=\"webkit\"",
     "debug-test-e2e-legacy": "cross-env playwright test --debug",
@@ -76,8 +83,10 @@
     "prettier": "prettier --list-different .",
     "ci-check": "npm-run-all --parallel tsc flow prettier lint",
     "prettier:fix": "prettier --write .",
-    "prepare-ci": "npm run build --prefix packages/lexical-playground && serve packages/lexical-playground/build -l 4000",
-    "prepare-ci-collab": "npm run build --prefix packages/lexical-playground && concurrently \"npm run collab\" \"serve packages/lexical-playground/build -l 4000\"",
+    "prepare-ci": "npm run build-dev --prefix packages/lexical-playground && serve packages/lexical-playground/build -l 4000",
+    "prepare-ci-collab": "npm run build-dev --prefix packages/lexical-playground && concurrently \"npm run collab\" \"serve packages/lexical-playground/build -l 4000\"",
+    "prepare-ci-prod": "npm run build-playground-prod && serve packages/lexical-playground/build -l 4000",
+    "prepare-ci-collab-prod": "npm run build-playground-prod && concurrently \"npm run collab\" \"serve packages/lexical-playground/build -l 4000\"",
     "prepare-release": "npm run build-release && node ./scripts/npm/prepare-release.js",
     "prepare": "husky install",
     "prepare-www": "node scripts/www/rewriteImports.js",

packages/lexical-playground/__tests__/e2e/MaxLength.spec.mjs

@@ -8,12 +8,9 @@
 
 import {
   assertHTML,
-  assertSelection,
-  clearEditor,
   focusEditor,
   html,
   initialize,
-  pasteFromClipboard,
   test,
 } from '../utils/index.mjs';
 
@@ -24,17 +21,11 @@ test.describe('MaxLength', () => {
   );
   test(`can restrict the text to specified length`, async ({page}) => {
     await focusEditor(page);
+
     await page.keyboard.type(
       'lorem ipsum dolor sit amet, consectetuer adipiscing elit',
     );
 
-    await assertSelection(page, {
-      anchorOffset: 30,
-      anchorPath: [0, 0, 0],
-      focusOffset: 30,
-      focusPath: [0, 0, 0],
-    });
-
     await assertHTML(
       page,
       html`
@@ -47,25 +38,8 @@ test.describe('MaxLength', () => {
     );
 
     await page.keyboard.press('ArrowRight');
-    await page.keyboard.type('Some more text');
-
-    await assertHTML(
-      page,
-      html`
-        <p
-          class="PlaygroundEditorTheme__paragraph PlaygroundEditorTheme__ltr"
-          dir="ltr">
-          <span data-lexical-text="true">lorem ipsum dolor sit amet, co</span>
-        </p>
-      `,
-    );
-  });
 
-  test(`can restrict pasted text to specified length`, async ({page}) => {
-    await focusEditor(page);
-    await pasteFromClipboard(page, {
-      'text/plain': 'lorem ipsum dolor sit amet, consectetuer adipiscing elit',
-    });
+    await page.keyboard.type('Some more text');
 
     await assertHTML(
       page,
@@ -78,51 +52,4 @@ test.describe('MaxLength', () => {
       `,
     );
   });
-
-  test(`can restrict emojis on boundaries`, async ({page}) => {
-    await pasteFromClipboard(page, {
-      'text/plain': 'lorem ipsum dolor sit amet, consectetur adipiscing elit',
-    });
-    await page.keyboard.press('Backspace');
-    await page.keyboard.type('💏');
-
-    await assertHTML(
-      page,
-      html`
-        <p
-          class="PlaygroundEditorTheme__paragraph PlaygroundEditorTheme__ltr"
-          dir="ltr">
-          <span data-lexical-text="true">lorem ipsum dolor sit amet, c</span>
-        </p>
-      `,
-    );
-
-    await page.keyboard.press('Backspace');
-    await page.keyboard.type('💏');
-
-    await assertHTML(
-      page,
-      html`
-        <p
-          class="PlaygroundEditorTheme__paragraph PlaygroundEditorTheme__ltr"
-          dir="ltr">
-          <span data-lexical-text="true">lorem ipsum dolor sit amet, 💏</span>
-        </p>
-      `,
-    );
-
-    await clearEditor(page);
-    await page.keyboard.type('👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻');
-
-    await assertHTML(
-      page,
-      html`
-        <p
-          class="PlaygroundEditorTheme__paragraph PlaygroundEditorTheme__ltr"
-          dir="ltr">
-          <span data-lexical-text="true">👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻👨‍💻</span>
-        </p>
-      `,
-    );
-  });
 });

packages/lexical-playground/package.json

@@ -4,7 +4,9 @@
   "private": true,
   "scripts": {
     "dev": "vite --host",
-    "build": "vite build",
+    "build-dev": "vite build",
+    "build-prod": "vite build --config vite.prod.config.js",
+    "build-vercel": "(cd ../../ && node ./scripts/build.js) && npm run build-prod",
     "preview": "vite preview"
   },
   "dependencies": {