playwright#Dialog TypeScript Examples

The following examples show how to use playwright#Dialog. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: accept-dialog.common.test.ts    From playwright-fluent with MIT License 6 votes vote down vote up 
describe('accept page dialog', (): void => {
  // eslint-disable-next-line @typescript-eslint/no-empty-function
  beforeEach((): void => {});

  test('should return an error when browser has not been launched', async (): Promise<void> => {
    // Given
    const page: Page | undefined = undefined;
    const dialog: Dialog | undefined = undefined;

    // When
    // Then
    const expectedError = new Error('Cannot accept dialog because no browser has been launched');
    // eslint-disable-next-line @typescript-eslint/no-empty-function
    await SUT.acceptDialog(dialog, 'foobar', page, () => {}).catch((error): void =>
      expect(error).toMatchObject(expectedError),
    );
  });
});
Example #2
Source File: cancel-dialog.ts    From playwright-fluent with MIT License 6 votes vote down vote up 
export async function cancelDialog(
  dialog: Dialog | undefined,
  page: Page | Frame | undefined,
  onCanceled: () => Promise<void> | void,
): Promise<void> {
  if (!page) {
    throw new Error(`Cannot cancel dialog because no browser has been launched`);
  }

  if (!dialog) {
    throw new Error(`Cannot cancel dialog because no dialog has been opened`);
  }

  await dialog.dismiss();
  await onCanceled();
}
Example #3
Source File: cancel-dialog.common.test.ts    From playwright-fluent with MIT License 6 votes vote down vote up 
describe('cancel page dialog', (): void => {
  // eslint-disable-next-line @typescript-eslint/no-empty-function
  beforeEach((): void => {});

  test('should return an error when browser has not been launched', async (): Promise<void> => {
    // Given
    const page: Page | undefined = undefined;
    const dialog: Dialog | undefined = undefined;

    // When
    // Then
    const expectedError = new Error('Cannot cancel dialog because no browser has been launched');
    // eslint-disable-next-line @typescript-eslint/no-empty-function
    await SUT.cancelDialog(dialog, page, () => {}).catch((error): void =>
      expect(error).toMatchObject(expectedError),
    );
  });
});
Example #4
Source File: record-page-dialogs.ts    From playwright-fluent with MIT License 6 votes vote down vote up 
export async function recordPageDialogs(
  page: Page | undefined,
  callback: (dialog: Dialog) => void,
): Promise<void> {
  if (!page) {
    throw new Error(`Cannot record page dialogs because no browser has been launched`);
  }

  page.on('dialog', (dialog) => {
    callback(dialog);
  });
}
Example #5
Source File: accept-dialog.ts    From playwright-fluent with MIT License 6 votes vote down vote up 
export async function acceptDialog(
  dialog: Dialog | undefined,
  promptText: string | undefined,
  page: Page | Frame | undefined,
  onAccepted: () => Promise<void> | void,
): Promise<void> {
  if (!page) {
    throw new Error(`Cannot accept dialog because no browser has been launched`);
  }

  if (!dialog) {
    throw new Error(`Cannot accept dialog because no dialog has been opened`);
  }

  await dialog.accept(promptText);
  await onAccepted();
}
Example #6
Source File: wait-for-dialog.common.test.ts    From playwright-fluent with MIT License 6 votes vote down vote up 
describe('wait for page dialog to open', (): void => {
  // eslint-disable-next-line @typescript-eslint/no-empty-function
  beforeEach((): void => {});

  test('should return an error when browser has not been launched', async (): Promise<void> => {
    // Given
    const page: Page | undefined = undefined;
    const dialog: Dialog | undefined = undefined;

    // When
    // Then
    const expectedError = new Error(
      'Cannot wait for a dialog to open because no browser has been launched',
    );
    await SUT.waitForDialog(() => dialog, page).catch((error): void =>
      expect(error).toMatchObject(expectedError),
    );
  });
});
Example #7
Source File: wait-for-dialog.ts    From playwright-fluent with MIT License 6 votes vote down vote up 
export async function waitForDialog(
  dialog: () => Dialog | undefined,
  page: Page | Frame | undefined,
  options: Partial<WaitUntilOptions> = defaultWaitUntilOptions,
): Promise<void> {
  if (!page) {
    throw new Error(`Cannot wait for a dialog to open because no browser has been launched`);
  }

  const waitOptions: WaitUntilOptions = {
    ...defaultWaitUntilOptions,
    ...options,
  };

  await waitUntil(
    async () => {
      const currentDialog = dialog();
      if (!currentDialog) {
        return false;
      }
      return true;
    },
    `No dialog has been opened. Maybe you forgot to call the '.withDialogs()' on the playwright-fluent instance.`,
    waitOptions,
  );
}
Example #8
Source File: has-dialog-exact-value.ts    From playwright-fluent with MIT License 6 votes vote down vote up 
export async function expectThatDialogHasExactValue(
  dialog: () => Dialog | undefined,
  value: string,
  options: Partial<AssertOptions> = defaultAssertOptions,
): Promise<void> {
  const waitOptions: WaitUntilOptions = {
    ...defaultWaitUntilOptions,
    ...defaultAssertOptions,
    ...options,
    throwOnTimeout: true,
  };

  await waitUntil(
    async () => {
      const currentDialog = dialog();
      const currentValue = currentDialog?.defaultValue();
      if (typeof currentValue !== 'string') {
        return false;
      }

      return currentValue === value;
    },
    async (): Promise<string> => {
      const currentDialog = dialog();
      if (!currentDialog) {
        return `No dialog has been opened. Maybe you forgot to call the '.withDialogs()' on the playwright-fluent instance.`;
      }
      return `Current dialog has value '${currentDialog.defaultValue()}' but it should be '${value}'`;
    },
    waitOptions,
  );
}
Example #9
Source File: has-dialog-value.ts    From playwright-fluent with MIT License 6 votes vote down vote up 
export async function expectThatDialogHasValue(
  dialog: () => Dialog | undefined,
  value: string,
  options: Partial<AssertOptions> = defaultAssertOptions,
): Promise<void> {
  const waitOptions: WaitUntilOptions = {
    ...defaultWaitUntilOptions,
    ...defaultAssertOptions,
    ...options,
    throwOnTimeout: true,
  };

  await waitUntil(
    async () => {
      const currentDialog = dialog();
      const currentValue = currentDialog?.defaultValue();
      if (typeof currentValue !== 'string') {
        return false;
      }

      if (currentValue.length === 0) {
        return value === '';
      }

      return currentValue.includes(value);
    },
    async (): Promise<string> => {
      const currentDialog = dialog();
      if (!currentDialog) {
        return `No dialog has been opened. Maybe you forgot to call the '.withDialogs()' on the playwright-fluent instance.`;
      }
      return `Current dialog has value '${currentDialog.defaultValue()}' but it should be '${value}'`;
    },
    waitOptions,
  );
}
Example #10
Source File: has-message.ts    From playwright-fluent with MIT License 6 votes vote down vote up 
export async function expectThatDialogHasMessage(
  dialog: () => Dialog | undefined,
  message: string,
  options: Partial<AssertOptions> = defaultAssertOptions,
): Promise<void> {
  const waitOptions: WaitUntilOptions = {
    ...defaultWaitUntilOptions,
    ...defaultAssertOptions,
    ...options,
    throwOnTimeout: true,
  };

  await waitUntil(
    async () => {
      const currentDialog = dialog();
      const currentMessage = currentDialog?.message();
      if (typeof currentMessage !== 'string') {
        return false;
      }

      return currentMessage.includes(message);
    },
    async (): Promise<string> => {
      const currentDialog = dialog();
      if (!currentDialog) {
        return `No dialog has been opened. Maybe you forgot to call the '.withDialogs()' on the playwright-fluent instance.`;
      }
      return `Current dialog has message '${currentDialog.message()}' but it should be '${message}'`;
    },
    waitOptions,
  );
}
Example #11
Source File: playwright-fluent.ts    From playwright-fluent with MIT License 5 votes vote down vote up 
private dialog: Dialog | undefined;
Example #12
Source File: playwright-fluent.ts    From playwright-fluent with MIT License 5 votes vote down vote up 
public currentDialog(): Dialog | undefined {
    return this.dialog;
  }
Example #13
Source File: is-dialog-of-type.ts    From playwright-fluent with MIT License 5 votes vote down vote up 
export async function expectThatDialogIsOfType(
  dialog: () => Dialog | undefined,
  dialogType: DialogType,
  options: Partial<AssertOptions> = defaultAssertOptions,
): Promise<void> {
  const waitOptions: WaitUntilOptions = {
    ...defaultWaitUntilOptions,
    ...defaultAssertOptions,
    ...options,
    throwOnTimeout: true,
  };

  switch (dialogType) {
    case 'alert':
    case 'beforeunload':
    case 'confirm':
    case 'prompt':
      break;
    default:
      throw new Error(
        `Unknown dialog type: '${dialogType}'. It should be 'alert', 'confirm', 'prompt' or 'beforeunload'`,
      );
  }

  await waitUntil(
    async () => {
      const currentDialog = dialog();
      if (!currentDialog) {
        return false;
      }
      return currentDialog && currentDialog.type() === dialogType;
    },
    async (): Promise<string> => {
      const currentDialog = dialog();
      if (!currentDialog) {
        return `No dialog has been opened. Maybe you forgot to call the '.withDialogs()' on the playwright-fluent instance.`;
      }
      return `Current dialog is of type '${currentDialog.type()}' but it should be '${dialogType}'`;
    },
    waitOptions,
  );
}
Example #14
Source File: wait-for-dialog.chromium.test.ts    From playwright-fluent with MIT License 4 votes vote down vote up 
describe('wait for page dialog to open', (): void => {
  // eslint-disable-next-line @typescript-eslint/no-empty-function
  beforeEach((): void => {});
  // eslint-disable-next-line @typescript-eslint/no-empty-function
  afterEach(async (): Promise<void> => {});

  test('should wait for confirm dialog to open', async (): Promise<void> => {
    // Given
    const browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };

    await recordPageDialogs(page, callback);

    // When
    await page.goto(`file:${path.join(__dirname, 'wait-for-dialog-confirm.test.html')}`);
    await SUT.waitForDialog(() => openedDialog, page);

    // Then
    expect(dialogIsOpened).toBe(true);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('confirm');
    await browser.close();
  });

  test('should wait for alert dialog to open', async (): Promise<void> => {
    // Given
    const browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };

    await recordPageDialogs(page, callback);

    // When
    await page.goto(`file:${path.join(__dirname, 'wait-for-dialog-alert.test.html')}`);
    await SUT.waitForDialog(() => openedDialog, page);

    // Then
    expect(dialogIsOpened).toBe(true);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('alert');
    await browser.close();
  });

  test('should wait for prompt dialog to open', async (): Promise<void> => {
    // Given
    const browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };

    await recordPageDialogs(page, callback);

    // When
    await page.goto(`file:${path.join(__dirname, 'wait-for-dialog-prompt.test.html')}`);
    await SUT.waitForDialog(() => openedDialog, page);

    // Then
    expect(dialogIsOpened).toBe(true);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('prompt');
    await browser.close();
  });
});
Example #15
Source File: record-page-dialogs.chromium.test.ts    From playwright-fluent with MIT License 4 votes vote down vote up 
describe('record page dialogs', (): void => {
  let browser: Browser | undefined = undefined;

  // eslint-disable-next-line @typescript-eslint/no-empty-function
  beforeEach((): void => {});
  afterEach(async (): Promise<void> => {
    if (browser) {
      await browser.close();
    }
  });

  test('should record confirm dialog', async (): Promise<void> => {
    // Given
    browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();

    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };

    // When
    await SUT.recordPageDialogs(page, callback);
    await page.goto(`file:${path.join(__dirname, 'record-page-dialogs-confirm.test.html')}`);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(true);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('confirm');
  });

  test('should record alert dialog', async (): Promise<void> => {
    // Given
    browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();

    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };

    // When
    await SUT.recordPageDialogs(page, callback);
    await page.goto(`file:${path.join(__dirname, 'record-page-dialogs-alert.test.html')}`);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(true);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('alert');
  });

  test('should record prompt dialog', async (): Promise<void> => {
    // Given
    browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();

    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };

    // When
    await SUT.recordPageDialogs(page, callback);
    await page.goto(`file:${path.join(__dirname, 'record-page-dialogs-prompt.test.html')}`);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(true);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('prompt');
  });
});
Example #16
Source File: cancel-dialog.chromium.test.ts    From playwright-fluent with MIT License 4 votes vote down vote up 
describe('cancel page dialog', (): void => {
  let browser: Browser | undefined = undefined;

  // eslint-disable-next-line @typescript-eslint/no-empty-function
  beforeEach((): void => {});
  afterEach(async (): Promise<void> => {
    if (browser) {
      await browser.close();
    }
  });

  test('should cancel confirm dialog', async (): Promise<void> => {
    // Given
    browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };
    const onCanceled = () => {
      dialogIsOpened = false;
    };

    await recordPageDialogs(page, callback);

    // When
    await page.goto(`file:${path.join(__dirname, 'cancel-dialog-confirm.test.html')}`);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(true);

    // When
    await SUT.cancelDialog(openedDialog, page, onCanceled);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(false);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('confirm');
  });

  test('should cancel alert dialog', async (): Promise<void> => {
    // Given
    browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };
    const onCanceled = () => {
      dialogIsOpened = false;
    };

    await recordPageDialogs(page, callback);

    // When
    await page.goto(`file:${path.join(__dirname, 'cancel-dialog-alert.test.html')}`);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(true);

    // When
    await SUT.cancelDialog(openedDialog, page, onCanceled);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(false);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('alert');
  });

  test('should cancel prompt dialog', async (): Promise<void> => {
    // Given
    browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };
    const onCanceled = () => {
      dialogIsOpened = false;
    };

    await recordPageDialogs(page, callback);

    // When
    await page.goto(`file:${path.join(__dirname, 'cancel-dialog-prompt.test.html')}`);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(true);

    // When
    await SUT.cancelDialog(openedDialog, page, onCanceled);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(false);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('prompt');
  });
});
Example #17
Source File: accept-dialog.chromium.test.ts    From playwright-fluent with MIT License 4 votes vote down vote up 
describe('accept page dialog', (): void => {
  let browser: Browser | undefined = undefined;

  // eslint-disable-next-line @typescript-eslint/no-empty-function
  beforeEach((): void => {});
  afterEach(async (): Promise<void> => {
    if (browser) {
      await browser.close();
    }
  });

  test('should accept confirm dialog', async (): Promise<void> => {
    // Given
    browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };
    const onAccepted = () => {
      dialogIsOpened = false;
    };

    await recordPageDialogs(page, callback);

    // When
    await page.goto(`file:${path.join(__dirname, 'accept-dialog-confirm.test.html')}`);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(true);

    // When
    await SUT.acceptDialog(openedDialog, undefined, page, onAccepted);

    // Then
    expect(dialogIsOpened).toBe(false);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('confirm');
  });

  test('should accept alert dialog', async (): Promise<void> => {
    // Given
    browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };
    const onAccepted = () => {
      dialogIsOpened = false;
    };

    await recordPageDialogs(page, callback);

    // When
    await page.goto(`file:${path.join(__dirname, 'accept-dialog-alert.test.html')}`);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(true);

    // When
    await SUT.acceptDialog(openedDialog, undefined, page, onAccepted);

    // Then
    expect(dialogIsOpened).toBe(false);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('alert');
  });

  test('should accept prompt dialog', async (): Promise<void> => {
    // Given
    browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };
    const onAccepted = () => {
      dialogIsOpened = false;
    };

    await recordPageDialogs(page, callback);

    // When
    await page.goto(`file:${path.join(__dirname, 'accept-dialog-prompt.test.html')}`);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(true);

    // When
    await SUT.acceptDialog(openedDialog, undefined, page, onAccepted);

    // Then
    expect(dialogIsOpened).toBe(false);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('prompt');
  });

  test('should accept prompt dialog with prompt text', async (): Promise<void> => {
    // Given
    browser = await chromium.launch({ headless: true });
    const context = await browser.newContext({ viewport: null });
    const page = await context.newPage();
    let dialogIsOpened = false;
    let openedDialog: Dialog | undefined = undefined;
    const callback = (dialog: Dialog) => {
      dialogIsOpened = true;
      openedDialog = dialog;
    };
    const onAccepted = () => {
      dialogIsOpened = false;
    };

    await recordPageDialogs(page, callback);

    // When
    await page.goto(`file:${path.join(__dirname, 'accept-dialog-prompt.test.html')}`);
    await sleep(3000);

    // Then
    expect(dialogIsOpened).toBe(true);

    // When
    await SUT.acceptDialog(openedDialog, 'foobar', page, onAccepted);

    // Then
    expect(dialogIsOpened).toBe(false);
    // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
    expect(openedDialog!.type()).toBe('prompt');
  });
});