diff --git a/.github/workflows/e2e-snapshots.yml b/.github/workflows/e2e-snapshots.yml index 1580230a..4627c483 100644 --- a/.github/workflows/e2e-snapshots.yml +++ b/.github/workflows/e2e-snapshots.yml @@ -28,7 +28,7 @@ jobs: - name: Run tests and update Snapshots run: | juno dev start --headless & - ./scripts/e2e-starter e2e:ci:snapshots + ./scripts/e2e e2e:ci:snapshots - name: Commit Playwright updated snapshots uses: EndBug/add-and-commit@v9 diff --git a/.github/workflows/e2e-tests.yml b/.github/workflows/e2e-tests.yml index 60bbe9e1..08374904 100644 --- a/.github/workflows/e2e-tests.yml +++ b/.github/workflows/e2e-tests.yml @@ -24,7 +24,7 @@ jobs: - name: Run tests run: | juno dev start --headless & - ./scripts/e2e-starter e2e:ci + ./scripts/e2e e2e:ci - name: Upload Playwright report on failure uses: actions/upload-artifact@v4 diff --git a/docker-compose.yml b/docker-compose.yml index 94de26a8..e0df451e 100644 --- a/docker-compose.yml +++ b/docker-compose.yml @@ -2,7 +2,7 @@ services: juno-satellite: image: junobuild/satellite:latest ports: - - 4943:5987 + - 5987:5987 - 5999:5999 volumes: - juno_satellite:/juno/.juno diff --git a/e2e/__screenshots__/angular-example/development/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/angular-example/development/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..cd6d6e00 Binary files /dev/null and b/e2e/__screenshots__/angular-example/development/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/angular-example/development/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/angular-example/development/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..0682269c Binary files /dev/null and b/e2e/__screenshots__/angular-example/development/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/angular-example/development/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/angular-example/development/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..2869f4fb Binary files /dev/null and b/e2e/__screenshots__/angular-example/development/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/angular-example/development/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/angular-example/development/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..36043d4f Binary files /dev/null and b/e2e/__screenshots__/angular-example/development/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/angular-example/development/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/angular-example/development/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/angular-example/development/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/angular-example/production/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/angular-example/production/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..2d4046bd Binary files /dev/null and b/e2e/__screenshots__/angular-example/production/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/angular-example/production/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/angular-example/production/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..373eb52c Binary files /dev/null and b/e2e/__screenshots__/angular-example/production/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/angular-example/production/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/angular-example/production/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..373eb52c Binary files /dev/null and b/e2e/__screenshots__/angular-example/production/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/angular-example/production/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/angular-example/production/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..c8a36263 Binary files /dev/null and b/e2e/__screenshots__/angular-example/production/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/angular-example/production/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/angular-example/production/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/angular-example/production/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/nextjs-example/development/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/nextjs-example/development/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..1f620eac Binary files /dev/null and b/e2e/__screenshots__/nextjs-example/development/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/nextjs-example/development/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/nextjs-example/development/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..660708db Binary files /dev/null and b/e2e/__screenshots__/nextjs-example/development/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/nextjs-example/development/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/nextjs-example/development/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..94e079fe Binary files /dev/null and b/e2e/__screenshots__/nextjs-example/development/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/nextjs-example/development/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/nextjs-example/development/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..ff692969 Binary files /dev/null and b/e2e/__screenshots__/nextjs-example/development/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/nextjs-example/development/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/nextjs-example/development/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/nextjs-example/development/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/nextjs-example/production/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/nextjs-example/production/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..d030cd06 Binary files /dev/null and b/e2e/__screenshots__/nextjs-example/production/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/nextjs-example/production/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/nextjs-example/production/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..12db2017 Binary files /dev/null and b/e2e/__screenshots__/nextjs-example/production/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/nextjs-example/production/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/nextjs-example/production/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..da8d0f3d Binary files /dev/null and b/e2e/__screenshots__/nextjs-example/production/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/nextjs-example/production/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/nextjs-example/production/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..c54bd778 Binary files /dev/null and b/e2e/__screenshots__/nextjs-example/production/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/nextjs-example/production/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/nextjs-example/production/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/nextjs-example/production/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/react-example/development/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/react-example/development/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..6f225891 Binary files /dev/null and b/e2e/__screenshots__/react-example/development/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/react-example/development/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/react-example/development/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..88717b3a Binary files /dev/null and b/e2e/__screenshots__/react-example/development/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/react-example/development/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/react-example/development/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..4441c7d5 Binary files /dev/null and b/e2e/__screenshots__/react-example/development/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/react-example/development/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/react-example/development/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..fb3fcd31 Binary files /dev/null and b/e2e/__screenshots__/react-example/development/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/react-example/development/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/react-example/development/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/react-example/development/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/react-example/production/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/react-example/production/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..300305d3 Binary files /dev/null and b/e2e/__screenshots__/react-example/production/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/react-example/production/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/react-example/production/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..273bba24 Binary files /dev/null and b/e2e/__screenshots__/react-example/production/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/react-example/production/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/react-example/production/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..273bba24 Binary files /dev/null and b/e2e/__screenshots__/react-example/production/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/react-example/production/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/react-example/production/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..35e4ac11 Binary files /dev/null and b/e2e/__screenshots__/react-example/production/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/react-example/production/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/react-example/production/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/react-example/production/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/react-ts-example/development/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/react-ts-example/development/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..bf4327d9 Binary files /dev/null and b/e2e/__screenshots__/react-ts-example/development/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/react-ts-example/development/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/react-ts-example/development/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..88717b3a Binary files /dev/null and b/e2e/__screenshots__/react-ts-example/development/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/react-ts-example/development/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/react-ts-example/development/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..4441c7d5 Binary files /dev/null and b/e2e/__screenshots__/react-ts-example/development/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/react-ts-example/development/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/react-ts-example/development/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..5ecd2e5a Binary files /dev/null and b/e2e/__screenshots__/react-ts-example/development/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/react-ts-example/development/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/react-ts-example/development/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..76cb67a8 Binary files /dev/null and b/e2e/__screenshots__/react-ts-example/development/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/react-ts-example/production/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/react-ts-example/production/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..62f91897 Binary files /dev/null and b/e2e/__screenshots__/react-ts-example/production/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/react-ts-example/production/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/react-ts-example/production/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..273bba24 Binary files /dev/null and b/e2e/__screenshots__/react-ts-example/production/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/react-ts-example/production/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/react-ts-example/production/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..273bba24 Binary files /dev/null and b/e2e/__screenshots__/react-ts-example/production/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/react-ts-example/production/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/react-ts-example/production/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..93edb877 Binary files /dev/null and b/e2e/__screenshots__/react-ts-example/production/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/react-ts-example/production/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/react-ts-example/production/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/react-ts-example/production/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..8fb52e6f Binary files /dev/null and b/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..638c3d07 Binary files /dev/null and b/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..aced531d Binary files /dev/null and b/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..8c0330e1 Binary files /dev/null and b/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/sveltekit-example/development/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..0e4936b2 Binary files /dev/null and b/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..a6d58175 Binary files /dev/null and b/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..a6d58175 Binary files /dev/null and b/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..566bd848 Binary files /dev/null and b/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/sveltekit-example/production/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..39fc2f04 Binary files /dev/null and b/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..471b4b38 Binary files /dev/null and b/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..820da695 Binary files /dev/null and b/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..b15e80ba Binary files /dev/null and b/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/vanilla-js-example/development/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..b142a5e4 Binary files /dev/null and b/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..cae763bb Binary files /dev/null and b/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..cae763bb Binary files /dev/null and b/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..a9f1877f Binary files /dev/null and b/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/vanilla-js-example/production/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/vue-example/development/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/vue-example/development/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..73ddb9d0 Binary files /dev/null and b/e2e/__screenshots__/vue-example/development/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/vue-example/development/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/vue-example/development/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..be11fb97 Binary files /dev/null and b/e2e/__screenshots__/vue-example/development/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/vue-example/development/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/vue-example/development/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..3584549d Binary files /dev/null and b/e2e/__screenshots__/vue-example/development/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/vue-example/development/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/vue-example/development/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..1b305bdc Binary files /dev/null and b/e2e/__screenshots__/vue-example/development/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/vue-example/development/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/vue-example/development/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/vue-example/development/example.spec.ts/uploaded-image.png differ diff --git a/e2e/__screenshots__/vue-example/production/example.spec.ts/logged-in-current-mode.png b/e2e/__screenshots__/vue-example/production/example.spec.ts/logged-in-current-mode.png new file mode 100644 index 00000000..8fe0997f Binary files /dev/null and b/e2e/__screenshots__/vue-example/production/example.spec.ts/logged-in-current-mode.png differ diff --git a/e2e/__screenshots__/vue-example/production/example.spec.ts/login-current-mode.png b/e2e/__screenshots__/vue-example/production/example.spec.ts/login-current-mode.png new file mode 100644 index 00000000..f6398bba Binary files /dev/null and b/e2e/__screenshots__/vue-example/production/example.spec.ts/login-current-mode.png differ diff --git a/e2e/__screenshots__/vue-example/production/example.spec.ts/logout-current-mode.png b/e2e/__screenshots__/vue-example/production/example.spec.ts/logout-current-mode.png new file mode 100644 index 00000000..f6398bba Binary files /dev/null and b/e2e/__screenshots__/vue-example/production/example.spec.ts/logout-current-mode.png differ diff --git a/e2e/__screenshots__/vue-example/production/example.spec.ts/modal-current-mode.png b/e2e/__screenshots__/vue-example/production/example.spec.ts/modal-current-mode.png new file mode 100644 index 00000000..b380f54f Binary files /dev/null and b/e2e/__screenshots__/vue-example/production/example.spec.ts/modal-current-mode.png differ diff --git a/e2e/__screenshots__/vue-example/production/example.spec.ts/uploaded-image.png b/e2e/__screenshots__/vue-example/production/example.spec.ts/uploaded-image.png new file mode 100644 index 00000000..e63d3ba8 Binary files /dev/null and b/e2e/__screenshots__/vue-example/production/example.spec.ts/uploaded-image.png differ diff --git a/e2e/data/dog.jpg b/e2e/data/dog.jpg new file mode 100644 index 00000000..ab6b9a4f Binary files /dev/null and b/e2e/data/dog.jpg differ diff --git a/e2e/example.spec.ts b/e2e/example.spec.ts new file mode 100644 index 00000000..a18a8e88 --- /dev/null +++ b/e2e/example.spec.ts @@ -0,0 +1,89 @@ +import {testWithII} from '@dfinity/internet-identity-playwright'; +import {initTestSuite} from './utils/init.utils'; + +const getExamplePage = initTestSuite(); + +testWithII('should sign-in', async () => { + const examplePage = getExamplePage(); + + await examplePage.assertSignedIn(); +}); + +testWithII('should add an entry', async () => { + const examplePage = getExamplePage(); + + await examplePage.addEntry('My notes.'); +}); + +testWithII('should add an entry with file', async () => { + const examplePage = getExamplePage(); + + await examplePage.addEntryWithFile({ + text: 'My file.', + filePath: 'e2e/data/dog.jpg' + }); + + await examplePage.assertUploadedImage(); +}); + +const lastEntryText = 'My last note.'; + +testWithII('should add another entry', async () => { + const examplePage = getExamplePage(); + + await examplePage.addEntry(lastEntryText); +}); + +testWithII('should delete entry', async () => { + const examplePage = getExamplePage(); + + await examplePage.deleteLastEntry(); +}); + +testWithII('should sign-out', async () => { + const examplePage = getExamplePage(); + + await examplePage.signOut(); + + await examplePage.assertSignedOut(); +}); + +// TODO: testWithII does not seem to support setting dark or light mode so for now we just use screenshot of default mode + +testWithII('match login screenshot', async () => { + const examplePage = getExamplePage(); + + await examplePage.assertSignedOut(); + + await examplePage.assertScreenshot({mode: 'current', name: 'login'}); +}); + +testWithII('match logged in screenshot', async () => { + const examplePage = getExamplePage(); + + await examplePage.signInWithIdentity(); + + await examplePage.assertSignedIn(); + + await examplePage.assertScreenshot({mode: 'current', name: 'logged-in'}); +}); + +testWithII('match modal screenshot', async () => { + const examplePage = getExamplePage(); + + await examplePage.openAddEntry(); + + await examplePage.assertScreenshot({mode: 'current', name: 'modal'}); + + await examplePage.closeAddEntryModal(); +}); + +testWithII('match logout screenshot', async () => { + const examplePage = getExamplePage(); + + await examplePage.signOut(); + + await examplePage.assertSignedOut(); + + await examplePage.assertScreenshot({mode: 'current', name: 'logout'}); +}); diff --git a/e2e/page-objects/example.page.ts b/e2e/page-objects/example.page.ts new file mode 100644 index 00000000..b0c67fa5 --- /dev/null +++ b/e2e/page-objects/example.page.ts @@ -0,0 +1,152 @@ +import {InternetIdentityPage} from '@dfinity/internet-identity-playwright'; +import {assertNonNullish} from '@dfinity/utils'; +import {expect} from '@playwright/test'; +import {IdentityPage, IdentityPageParams} from './identity.page'; + +export class ExamplePage extends IdentityPage { + #partyIIPage: InternetIdentityPage; + + constructor(params: IdentityPageParams) { + super(params); + + this.#partyIIPage = new InternetIdentityPage({ + page: this.page, + context: this.context, + browser: this.browser + }); + } + + /** + * @override + */ + async signIn(): Promise { + this.identity = await this.#partyIIPage.signInWithNewIdentity({ + selector: 'button:has-text("Sign in")' + }); + } + + async signInWithIdentity(): Promise { + assertNonNullish(this.identity); + + await this.#partyIIPage.signInWithIdentity({ + identity: this.identity, + selector: 'button:has-text("Sign in")' + }); + } + + /** + * @override + */ + async signOut(): Promise { + const button = this.page.locator('button', {hasText: 'Logout'}); + await button.click(); + } + + async assertSignedIn(): Promise { + const button = this.page.locator('button', {hasText: 'Logout'}); + await expect(button).toBeVisible(); + } + + async assertSignedOut(): Promise { + const button = this.page.locator('button', {hasText: 'Sign in'}); + await expect(button).toBeVisible(); + } + + async waitReady(): Promise { + const REPLICA_URL = 'http://127.0.0.1:5987'; + const INTERNET_IDENTITY_ID = 'rdmx6-jaaaa-aaaaa-aaadq-cai'; + + await this.#partyIIPage.waitReady({url: REPLICA_URL, canisterId: INTERNET_IDENTITY_ID}); + } + + async goto(): Promise { + await this.page.goto('/'); + } + + async addEntry(text: string): Promise { + const addEntryButton = this.page.locator('button', {hasText: 'Add an entry'}); + await expect(addEntryButton).toBeVisible(); + + await addEntryButton.click(); + + const textarea = this.page.locator('textarea'); + await textarea.fill(text); + + const button = this.page.locator('button', {hasText: 'Submit'}); + await button.click(); + + const row = this.page.locator('[role="row"]', {hasText: text}); + await expect(row).toBeVisible(); + } + + async addEntryWithFile({text, filePath}: {text: string; filePath: string}): Promise { + const addEntryButton = this.page.locator('button', {hasText: 'Add an entry'}); + await expect(addEntryButton).toBeVisible(); + + await addEntryButton.click(); + + const textarea = this.page.locator('textarea'); + await textarea.fill(text); + + const fileInput = this.page.locator('input[type="file"]'); + await fileInput.setInputFiles(filePath); + + const button = this.page.locator('button', {hasText: 'Submit'}); + await button.click(); + + const row = this.page.locator('[role="row"]', {hasText: text}); + await expect(row).toBeVisible({timeout: 60_000}); + } + + async assertUploadedImage(): Promise { + const [imgPage] = await Promise.all([ + this.page.context().waitForEvent('page'), + this.page.locator('a[aria-label="Open data"]').click() + ]); + + await imgPage.waitForLoadState('load'); + + await expect(imgPage).toHaveScreenshot('uploaded-image.png', { + maxDiffPixelRatio: 0.1 + }); + + await imgPage.close(); + } + + async deleteLastEntry(): Promise { + const buttons = this.page.locator('button[aria-label="Delete entry"]'); + await buttons.last().click(); + + await expect(this.page.locator('[role="row"]', {hasText: 'text'})).toHaveCount(0); + } + + async assertScreenshot({ + mode, + name + }: { + mode: 'light' | 'dark' | 'current'; + name: string; + }): Promise { + await expect(this.page).toHaveScreenshot(`${name}-${mode}-mode.png`, { + fullPage: true, + maxDiffPixelRatio: 0.1 + }); + } + + async openAddEntry(): Promise { + const addEntryButton = this.page.locator('button', {hasText: 'Add an entry'}); + await expect(addEntryButton).toBeVisible(); + + await addEntryButton.click(); + + const textarea = this.page.locator('textarea'); + await expect(textarea).toBeVisible(); + } + + async closeAddEntryModal(): Promise { + const closeAddEntryButton = this.page.locator('button', {hasText: 'Close'}); + await expect(closeAddEntryButton).toBeVisible(); + + await closeAddEntryButton.click(); + } +} diff --git a/e2e/page-objects/identity.page.ts b/e2e/page-objects/identity.page.ts new file mode 100644 index 00000000..f5c65fa0 --- /dev/null +++ b/e2e/page-objects/identity.page.ts @@ -0,0 +1,29 @@ +import {Browser, BrowserContext, Page} from '@playwright/test'; + +export interface IdentityPageParams { + page: Page; + context: BrowserContext; + browser: Browser; +} + +export abstract class IdentityPage { + protected identity: number | undefined; + + protected readonly page: Page; + protected readonly context: BrowserContext; + protected readonly browser: Browser; + + protected constructor({page, context, browser}: IdentityPageParams) { + this.page = page; + this.context = context; + this.browser = browser; + } + + abstract signIn(): Promise; + + abstract signOut(): Promise; + + async close(): Promise { + await this.page.close(); + } +} diff --git a/e2e/starter.spec.ts b/e2e/starter.spec.ts index 8d0a7394..4328ab45 100644 --- a/e2e/starter.spec.ts +++ b/e2e/starter.spec.ts @@ -11,7 +11,10 @@ const TEMPLATE = process.env.TEMPLATE ?? ''; await expect(page.getByText('Welcome to Juno')).toBeVisible(); - await expect(page).toHaveScreenshot(`${mode}-mode.png`, {fullPage: true}); + await expect(page).toHaveScreenshot(`${mode}-mode.png`, { + fullPage: true, + maxDiffPixelRatio: 0.1 + }); }); }); }); diff --git a/e2e/utils/init.utils.ts b/e2e/utils/init.utils.ts new file mode 100644 index 00000000..b65e22af --- /dev/null +++ b/e2e/utils/init.utils.ts @@ -0,0 +1,35 @@ +import {testWithII} from '@dfinity/internet-identity-playwright'; +import {ExamplePage} from '../page-objects/example.page'; + +export const initTestSuite = (): (() => ExamplePage) => { + testWithII.describe.configure({mode: 'serial'}); + + let examplePage: ExamplePage; + + testWithII.beforeAll(async ({playwright}) => { + testWithII.setTimeout(120000); + + const browser = await playwright.chromium.launch(); + + const context = await browser.newContext(); + const page = await context.newPage(); + + examplePage = new ExamplePage({ + page, + context, + browser + }); + + await examplePage.waitReady(); + + await examplePage.goto(); + + await examplePage.signIn(); + }); + + testWithII.afterAll(async () => { + await examplePage.close(); + }); + + return (): ExamplePage => examplePage; +}; diff --git a/juno.dev.config.js b/juno.dev.config.js index a985e4dc..822145f9 100644 --- a/juno.dev.config.js +++ b/juno.dev.config.js @@ -4,8 +4,24 @@ import {defineDevConfig} from '@junobuild/config'; export default defineDevConfig(() => ({ satellite: { collections: { - datastore: [], - storage: [] + datastore: [ + { + collection: 'notes', + read: 'managed', + write: 'managed', + memory: 'stable', + mutablePermissions: true + } + ], + storage: [ + { + collection: 'images', + read: 'managed', + write: 'managed', + memory: 'stable', + mutablePermissions: true + } + ] } } })); diff --git a/package-lock.json b/package-lock.json index 07e7d482..27a1ff50 100644 --- a/package-lock.json +++ b/package-lock.json @@ -19,6 +19,7 @@ "create-juno": "dist/index.js" }, "devDependencies": { + "@dfinity/internet-identity-playwright": "^0.0.5", "@eslint/eslintrc": "^3.2.0", "@eslint/js": "^9.20.0", "@junobuild/config": "^0.1.0", @@ -75,6 +76,19 @@ "@dfinity/principal": "^2.2.0" } }, + "node_modules/@dfinity/internet-identity-playwright": { + "version": "0.0.5", + "resolved": "https://registry.npmjs.org/@dfinity/internet-identity-playwright/-/internet-identity-playwright-0.0.5.tgz", + "integrity": "sha512-tCmjsX7ui4Qw2s7Ufoh1xJayLUHFbXaSsybrTfYtv3uZlYtMM+dU24lnNv1IPKh19dalXMxi+IWuY5ePGR9KZQ==", + "dev": true, + "license": "Apache-2.0", + "engines": { + "node": ">=22" + }, + "peerDependencies": { + "@playwright/test": "^1.44.1" + } + }, "node_modules/@dfinity/principal": { "version": "2.2.0", "resolved": "https://registry.npmjs.org/@dfinity/principal/-/principal-2.2.0.tgz", diff --git a/package.json b/package.json index 59ed58c4..e9456506 100644 --- a/package.json +++ b/package.json @@ -43,6 +43,7 @@ "tar-stream": "^3.1.7" }, "devDependencies": { + "@dfinity/internet-identity-playwright": "^0.0.5", "@eslint/eslintrc": "^3.2.0", "@eslint/js": "^9.20.0", "@junobuild/config": "^0.1.0", diff --git a/scripts/e2e b/scripts/e2e new file mode 100755 index 00000000..376335cc --- /dev/null +++ b/scripts/e2e @@ -0,0 +1,6 @@ +#!/usr/bin/env bash + +TEST_TYPE=${1:-e2e} + +./scripts/e2e-starter "$TEST_TYPE" +./scripts/e2e-example "$TEST_TYPE" \ No newline at end of file diff --git a/scripts/e2e-example b/scripts/e2e-example new file mode 100755 index 00000000..41c1a8ab --- /dev/null +++ b/scripts/e2e-example @@ -0,0 +1,17 @@ +#!/usr/bin/env bash + +TEST_TYPE=${1:-e2e} + +function run_test() { + local template=$1 + + echo -e "\n***** $TEST_TYPE for $template *****\n" + + TEMPLATE=$template npm run "$TEST_TYPE" e2e/example.spec.ts +} + +STARTERS=angular-example,nextjs-example,react-example,react-ts-example,sveltekit-example,vanilla-js-example,vue-example + +for template in $(echo $STARTERS | sed "s/,/ /g"); do + run_test "$template" +done \ No newline at end of file diff --git a/scripts/e2e-starter b/scripts/e2e-starter index 0d6f35aa..e7a751e7 100755 --- a/scripts/e2e-starter +++ b/scripts/e2e-starter @@ -7,7 +7,7 @@ function run_test() { echo -e "\n***** $TEST_TYPE for $template *****\n" - TEMPLATE=$template npm run "$TEST_TYPE" + TEMPLATE=$template npm run "$TEST_TYPE" e2e/starter.spec.ts } STARTERS=angular-starter,astro-starter,nextjs-starter,react-starter,react-ts-starter,sveltekit-starter,vue-starter diff --git a/scripts/install-deps b/scripts/install-deps index d3fedd1c..76ecea5e 100755 --- a/scripts/install-deps +++ b/scripts/install-deps @@ -8,7 +8,7 @@ function install_deps() { npm i --prefix "templates/$template" } -STARTERS=angular-starter,astro-starter,nextjs-starter,react-starter,react-ts-starter,sveltekit-starter,vue-starter +STARTERS=angular-starter,astro-starter,nextjs-starter,react-starter,react-ts-starter,sveltekit-starter,vue-starter,angular-example,nextjs-example,react-example,react-ts-example,sveltekit-example,vanilla-js-example,vue-example for template in $(echo $STARTERS | sed "s/,/ /g"); do install_deps "$template" diff --git a/templates/angular-example/src/app/components/delete/delete.component.html b/templates/angular-example/src/app/components/delete/delete.component.html index b78ceeec..2be30f9a 100644 --- a/templates/angular-example/src/app/components/delete/delete.component.html +++ b/templates/angular-example/src/app/components/delete/delete.component.html @@ -2,6 +2,7 @@ role="cell" class="hover:text-lavender-blue-500 active:text-lavender-blue-400" (click)="delItem()" + aria-label="Delete entry" > {