test: add in-between assertions and more fixtures (#1224)

packages/e2e-tests/fixtures/applications-page.js

@@ -2,6 +2,16 @@ const path = require('node:path');
 const { BasePage } = require('./base-page');
 
 export class ApplicationsPage extends BasePage {
+  /**
+   * @param {import('@playwright/test').Page} page
+   */
+  constructor(page) {
+    super(page);
+
+    this.drawerLink = this.page.getByTestId('apps-page-drawer-link');
+    this.addConnectionButton = this.page.getByTestId('add-connection-button');
+  }
+
   async screenshot(options = {}) {
     const { path: plainPath, ...restOptions } = options;
 

packages/e2e-tests/fixtures/flow-editor-page.js

@@ -2,8 +2,12 @@ const path = require('node:path');
 const { BasePage } = require('./base-page');
 
 export class FlowEditorPage extends BasePage {
+  /**
+   * @param {import('@playwright/test').Page} page
+   */
   constructor(page) {
     super(page);
+
     this.appAutocomplete = this.page.getByTestId('choose-app-autocomplete');
     this.eventAutocomplete = this.page.getByTestId('choose-event-autocomplete');
     this.continueButton = this.page.getByTestId('flow-substep-continue-button');
@@ -15,6 +19,7 @@ export class FlowEditorPage extends BasePage {
     this.publishFlowButton = this.page.getByTestId('publish-flow-button');
     this.infoSnackbar = this.page.getByTestId('flow-cannot-edit-info-snackbar');
     this.trigger = this.page.getByLabel('Trigger on weekends?');
+    this.stepCircularLoader = this.page.getByTestId('step-circular-loader');
   }
 
   async screenshot(options = {}) {

packages/e2e-tests/fixtures/index.js

@@ -1,11 +1,11 @@
-const base = require('@playwright/test');
+const { test, expect} = require('@playwright/test');
 const { ApplicationsPage } = require('./applications-page');
 const { ConnectionsPage } = require('./connections-page');
 const { ExecutionsPage } = require('./executions-page');
 const { FlowEditorPage } = require('./flow-editor-page');
 const { LoginPage } = require('./login-page');
 
-exports.test = base.test.extend({
+exports.test = test.extend({
   page: async ({ page }, use) => {
     await new LoginPage(page).login();
 
@@ -25,4 +25,12 @@ exports.test = base.test.extend({
   },
 });
 
-exports.expect = base.expect;
+expect.extend({
+  toBeClickableLink: async (locator) => {
+    await expect(locator).not.toHaveAttribute('aria-disabled', 'true');
+
+    return { pass: true };
+  }
+});
+
+exports.expect = expect;

packages/e2e-tests/fixtures/login-page.js

@@ -1,4 +1,5 @@
 const path = require('node:path');
+const { expect } = require('@playwright/test');
 const { BasePage } = require('./base-page');
 
 export class LoginPage extends BasePage {
@@ -9,7 +10,6 @@ export class LoginPage extends BasePage {
     super(page);
 
     this.page = page;
-
     this.emailTextField = this.page.getByTestId('email-text-field');
     this.passwordTextField = this.page.getByTestId('password-text-field');
     this.loginButton = this.page.getByTestId('login-button');
@@ -23,5 +23,7 @@ export class LoginPage extends BasePage {
     await this.passwordTextField.fill(process.env.LOGIN_PASSWORD);
 
     await this.loginButton.click();
+
+    await expect(this.loginButton).not.toBeVisible();
   }
 }