diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index 717a55dc010a..b9ab584ab06d 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -281,6 +281,105 @@ jobs: steps: - run: echo "Skipped" + smoke-tests-react-18: + needs: check + + strategy: + matrix: + os: [ubuntu-latest, windows-latest] + bundler: [vite, webpack] + + name: 🔄 Smoke tests React 18 / ${{ matrix.os }} / ${{ matrix.bundler }} / node 20 latest + runs-on: ${{ matrix.os }} + + env: + REDWOOD_CI: 1 + REDWOOD_VERBOSE_TELEMETRY: 1 + + steps: + - name: Checkout the framework code + uses: actions/checkout@v4 + with: + path: __tmp__fw_copy + + - name: Set up job + uses: ./.github/actions/set-up-job + with: + yarn-install-directory: ./__tmp__fw_copy + + - name: 🌲 Set up test project for React 18 + id: set-up-test-project-react-18 + working-directory: __tmp__fw_copy + uses: ./.github/actions/set-up-test-project + with: + bundler: ${{ matrix.bundler }} + env: + REDWOOD_DISABLE_TELEMETRY: 1 + YARN_ENABLE_IMMUTABLE_INSTALLS: false + + - name: 🎭 Install playwright dependencies + run: npx playwright install --with-deps chromium + + - name: 🧑‍💻 Run dev smoke tests + working-directory: ./tasks/smoke-tests/dev + run: npx playwright test + env: + REDWOOD_TEST_PROJECT_PATH: '${{ steps.set-up-test-project-react-18.outputs.test-project-path }}' + REDWOOD_DISABLE_TELEMETRY: 1 + + - name: 🔐 Run auth smoke tests + working-directory: ./tasks/smoke-tests/auth + run: npx playwright test + env: + REDWOOD_TEST_PROJECT_PATH: ${{ steps.set-up-test-project-react-18.outputs.test-project-path }} + REDWOOD_DISABLE_TELEMETRY: 1 + + - name: Run `rw build --no-prerender` + run: | + yarn rw build --no-prerender + working-directory: ${{ steps.set-up-test-project-react-18.outputs.test-project-path }} + + - name: Run `rw prerender` + run: | + yarn rw prerender --verbose + working-directory: ${{ steps.set-up-test-project-react-18.outputs.test-project-path }} + + - name: 🖥️ Run serve smoke tests + working-directory: tasks/smoke-tests/serve + run: npx playwright test + env: + REDWOOD_TEST_PROJECT_PATH: ${{ steps.set-up-test-project-react-18.outputs.test-project-path }} + REDWOOD_DISABLE_TELEMETRY: 1 + + - name: 📄 Run prerender smoke tests + working-directory: tasks/smoke-tests/prerender + run: npx playwright test + env: + REDWOOD_TEST_PROJECT_PATH: ${{ steps.set-up-test-project-react-18.outputs.test-project-path }} + REDWOOD_DISABLE_TELEMETRY: 1 + + - name: 📕 Run Storybook smoke tests + working-directory: tasks/smoke-tests/storybook + run: npx playwright test + env: + REDWOOD_TEST_PROJECT_PATH: ${{ steps.set-up-test-project-react-18.outputs.test-project-path }} + REDWOOD_DISABLE_TELEMETRY: 1 + + smoke-tests-react-18-skip: + needs: detect-changes + if: needs.detect-changes.outputs.code == 'false' + + strategy: + matrix: + os: [ubuntu-latest, windows-latest] + bundler: [vite, webpack] + + name: 🔄 Smoke tests React 18 / ${{ matrix.os }} / ${{ matrix.bundler }} / node 20 latest + runs-on: ${{ matrix.os }} + + steps: + - run: echo "Skipped" + cli-smoke-tests: needs: check diff --git a/tasks/smoke-tests/shared/common.ts b/tasks/smoke-tests/shared/common.ts index deee6af7c03b..021dedd3c01a 100644 --- a/tasks/smoke-tests/shared/common.ts +++ b/tasks/smoke-tests/shared/common.ts @@ -7,18 +7,18 @@ export async function smokeTest({ page }: PlaywrightTestArgs) { // Check that the blog posts load. We're deliberately not checking their titles because we edit them in other tests. await expect( page.getByText( - 'Meh waistcoat succulents umami asymmetrical, hoodie post-ironic paleo chillwave ' - ) + 'Meh waistcoat succulents umami asymmetrical, hoodie post-ironic paleo chillwave ', + ), ).toBeVisible() await expect( page.getByText( - 'Raclette shoreditch before they sold out lyft. Ethical bicycle rights meh prism ' - ) + 'Raclette shoreditch before they sold out lyft. Ethical bicycle rights meh prism ', + ), ).toBeVisible() await expect( page.getByText( - "I'm baby single- origin coffee kickstarter lo - fi paleo skateboard.Tumblr hasht" - ) + "I'm baby single- origin coffee kickstarter lo - fi paleo skateboard.Tumblr hasht", + ), ).toBeVisible() // CSS checks. We saw this break when we switched bundlers, so while it's not comprehensive, it's at least something. @@ -26,20 +26,20 @@ export async function smokeTest({ page }: PlaywrightTestArgs) { const bgBlue700 = 'rgb(29, 78, 216)' expect(page.locator('#redwood-app > header')).toHaveCSS( 'background-color', - bgBlue700 + bgBlue700, ) const textBlue400 = 'rgb(96, 165, 250)' - expect(await page.getByRole('link', { name: 'Redwood Blog' })).toHaveCSS( + expect(page.getByRole('link', { name: 'Redwood Blog' })).toHaveCSS( 'color', - textBlue400 + textBlue400, ) // Check the about page. await page.getByRole('link', { name: 'About', exact: true }).click() expect(page.url()).toBe('http://localhost:8910/about') - await page.getByText( - 'This site was created to demonstrate my mastery of Redwood: Look on my works, ye' + page.getByText( + 'This site was created to demonstrate my mastery of Redwood: Look on my works, ye', ) // Check the contact us page. @@ -78,7 +78,7 @@ export const signUpTestUser = async ({ await Promise.race([ page.waitForURL('/'), expect( - page.getByText(`Username \`${email}\` already in use`) + page.getByText(`Username \`${email}\` already in use`), ).toBeVisible(), ]) }