From ef473d34f57566cb13aff0fc9d8c5d88261d09fc Mon Sep 17 00:00:00 2001
From: Otto Richter <git@otto.splvs.net>
Date: Sat, 14 Sep 2024 12:04:43 +0200
Subject: [PATCH] docs(e2e): Add parametric viewport example test

---
 tests/e2e/example.test.e2e.js | 30 +++++++++++++++++++-----------
 1 file changed, 19 insertions(+), 11 deletions(-)

diff --git a/tests/e2e/example.test.e2e.js b/tests/e2e/example.test.e2e.js
index 06c70d0355..86abdf685e 100644
--- a/tests/e2e/example.test.e2e.js
+++ b/tests/e2e/example.test.e2e.js
@@ -1,6 +1,6 @@
 // @ts-check
 import {expect} from '@playwright/test';
-import {test, login_user, save_visual, load_logged_in_context} from './utils_e2e.js';
+import {test, login_user, save_visual} from './utils_e2e.js';
 
 test.beforeAll(async ({browser}, workerInfo) => {
   await login_user(browser, workerInfo, 'user2');
@@ -29,14 +29,22 @@ test('Register Form', async ({page}, workerInfo) => {
   save_visual(page);
 });
 
-test('Logged In User', async ({browser}, workerInfo) => {
-  const context = await load_logged_in_context(browser, workerInfo, 'user2');
-  const page = await context.newPage();
-
-  await page.goto('/');
-
-  // Make sure we routed to the home page. Else login failed.
-  await expect(page.url()).toBe(`${workerInfo.project.use.baseURL}/`);
-
-  save_visual(page);
+// eslint-disable-next-line playwright/no-skipped-test
+test.describe.skip('example with different viewports (not actually run)', () => {
+  // only necessary when the default web / mobile devices are not enough.
+  // If you need to use a single fixed viewport, you can also use:
+  // test.use({viewport: {width: 400, height: 800}});
+  // also see https://playwright.dev/docs/test-parameterize
+  for (const width of [400, 1000]) {
+    // do not actually run (skip) this test
+    test(`Do x on width: ${width}px`, async ({page}) => {
+      await page.setViewportSize({
+        width,
+        height: 800,
+      });
+      // do something, then check that an element is fully in viewport
+      // (i.e. not overflowing)
+      await expect(page.locator('#my-element')).toBeInViewport({ratio: 1});
+    });
+  }
 });