Playwright tests - stage 1 - login with email and password test (#8988)

Scenario:
https://github.com/twentyhq/twenty/issues/8469#issuecomment-2471420099

To launch this test, `yarn playwright test --project Authentication`
must be used in `packages/twenty-e2e-testing` directory (for some reason
when launching this test from IDE, be Webstorm or VSCode, it won't fetch
the data from .env)

packages/twenty-e2e-testing/.env.example

@@ -1,5 +1,5 @@
 # Note that provide always without trailing forward slash to have expected behaviour
-FRONTEND_BASE_URL=http://localhost:3001
+FRONTEND_BASE_URL=http://app.localhost:3001
 CI_DEFAULT_BASE_URL=https://demo.twenty.com
 DEFAULT_LOGIN=tim@apple.dev
 NEW_WORKSPACE_LOGIN=test@apple.dev

packages/twenty-e2e-testing/lib/pom/loginPage.ts

@@ -10,7 +10,7 @@ export class LoginPage {
   private readonly forgotPasswordButton: Locator;
   private readonly passwordField: Locator;
   private readonly revealPasswordButton: Locator;
-  private readonly signInButton: Locator;
+  readonly signInButton: Locator;
   private readonly signUpButton: Locator;
   private readonly previewImageButton: Locator;
   private readonly uploadImageButton: Locator;

packages/twenty-e2e-testing/playwright.config.ts

@@ -16,12 +16,12 @@ export default defineConfig({
   fullyParallel: true, // false only for specific tests, overwritten in specific projects or global setups of projects
   forbidOnly: !!process.env.CI,
   retries: process.env.CI ? 2 : 0,
-  workers: process.env.CI ? 1 : undefined, // undefined = amount of projects * amount of tests
+  workers: 1, // 1 worker = 1 test at the time, tests can't be parallelized
   timeout: 30 * 1000, // timeout can be changed
   use: {
     baseURL: process.env.CI
       ? process.env.CI_DEFAULT_BASE_URL
-      : (process.env.FRONTEND_BASE_URL ?? 'http://localhost:3001'),
+      : (process.env.FRONTEND_BASE_URL ?? 'http://app.localhost:3001'),
     trace: 'retain-on-failure', // trace takes EVERYTHING from page source, records every single step, should be used only when normal debugging won't work
     screenshot: 'on', // either 'on' here or in different method in modules, if 'on' all screenshots are overwritten each time the test is run
     headless: true, // instead of changing it to false, run 'yarn test:e2e:debug' or 'yarn test:e2e:ui'
@@ -56,6 +56,10 @@ export default defineConfig({
       },
       dependencies: ['Login setup'],
     },
+    {
+      name: 'Authentication',
+      testMatch: /authentication\/.*\.spec\.ts/,
+    },
 
     //{
     //  name: 'webkit',

packages/twenty-e2e-testing/tests/authentication/login.spec.ts

@@ -0,0 +1,17 @@
+import { test as base, expect } from '../../lib/fixtures/screenshot';
+import { LoginPage } from '../../lib/pom/loginPage';
+
+// fixture
+const test = base.extend<{ loginPage: LoginPage }>({
+  loginPage: async ({ page }, use) => {
+    await use(new LoginPage(page));
+  },
+});
+
+test('Check login with email', async ({ loginPage }) => {
+  await loginPage.typeEmail(process.env.DEFAULT_LOGIN);
+  await loginPage.clickContinueButton();
+  await loginPage.typePassword(process.env.DEFAULT_PASSWORD);
+  await loginPage.clickSignInButton();
+  await expect(loginPage.signInButton).not.toBeVisible();
+});