Suppress `lint:js` warnings in CI and GitHub PRs (https://github.com/woocommerce/woocommerce-admin/pull/8020)

- Add returned type annotations to `packages/admin-e2e-tests/src/elements/*.ts` and `packages/admin-e2e-tests/src/*.ts`.
- Remove unused vars from `packages/admin-e2e-tests/src/*.ts`.
- Simplify `unknown` type union.

Co-authored-by: Ilyas Foo <foo.ilyas@gmail.com>

plugins/woocommerce-admin/changelogs/fix-lint-js-types

@@ -0,0 +1,5 @@
+Significance: patch
+Type: Dev
+Comment: This is an insignificant change that adds TypeScript type annotations. #8020
+
+

plugins/woocommerce-admin/packages/admin-e2e-tests/CHANGELOG.md

@@ -1,5 +1,7 @@
 # Unreleased
 
+-   Add returned type annotations and remove unused vars. #8020
+
 -   Add E2E tests for checking store currency if it matches the onboarded country. #7712
 
 -   Make unchecking free features more robust. #7761

plugins/woocommerce-admin/packages/admin-e2e-tests/src/elements/DropdownField.ts

@@ -5,7 +5,7 @@ import { getElementByText, getInputValue } from '../utils/actions';
 import { BaseElement } from './BaseElement';
 
 export class DropdownField extends BaseElement {
-	async select( value: string ) {
+	async select( value: string ): Promise< void > {
 		const currentVal = await getInputValue( this.selector + ' input' );
 		if ( currentVal !== value ) {
 			await this.page.click(
@@ -19,9 +19,10 @@ export class DropdownField extends BaseElement {
 			await button?.click();
 			await this.checkSelected( value );
 		}
+		return undefined;
 	}
 
-	async checkSelected( value: string ) {
+	async checkSelected( value: string ): Promise< void > {
 		const currentVal = await getInputValue( this.selector + ' input' );
 		expect( currentVal ).toBe( value );
 	}

plugins/woocommerce-admin/packages/admin-e2e-tests/src/elements/DropdownTypeaheadField.ts

@@ -8,14 +8,14 @@ const { clearAndFillInput } = require( '@woocommerce/e2e-utils' );
 /* eslint-enable @typescript-eslint/no-var-requires */
 
 export class DropdownTypeaheadField extends BaseElement {
-	async search( text: string ) {
+	async search( text: string ): Promise< void > {
 		await clearAndFillInput( this.selector + '-0__control-input', text );
 	}
-	async select( selector: string ) {
+	async select( selector: string ): Promise< void > {
 		await this.page.click( this.selector + `__option-0-${ selector }` );
 	}
 
-	async checkSelected( value: string ) {
+	async checkSelected( value: string ): Promise< void > {
 		const selector = this.selector + '-0__control-input';
 		await page.focus( selector );
 		const field = await this.page.$( selector );

plugins/woocommerce-admin/packages/admin-e2e-tests/src/elements/FormToggle.ts

@@ -1,3 +1,7 @@
+/**
+ * External dependencies
+ */
+import type { ElementHandle } from 'puppeteer';
 /**
  * Internal dependencies
  */
@@ -6,7 +10,7 @@ import { hasClass } from '../utils/actions';
 
 export class FormToggle extends BaseElement {
 	// Represents a FormToggle input. Use `selector` to represent the container its found in.
-	async switchOn() {
+	async switchOn(): Promise< void > {
 		const container = await this.getCheckboxContainer();
 		if ( container && ! ( await hasClass( container, 'is-checked' ) ) ) {
 			const input = await this.getCheckboxInput();
@@ -25,7 +29,7 @@ export class FormToggle extends BaseElement {
 		}
 	}
 
-	async switchOff() {
+	async switchOff(): Promise< void > {
 		const container = await this.getCheckboxContainer();
 		if ( container && ( await hasClass( container, 'is-checked' ) ) ) {
 			const input = await this.getCheckboxInput();
@@ -48,17 +52,17 @@ export class FormToggle extends BaseElement {
 		}
 	}
 
-	async getCheckboxContainer() {
+	async getCheckboxContainer(): Promise< ElementHandle< Element > | null > {
 		return this.page.$( `${ this.selector } .components-form-toggle` );
 	}
 
-	async getCheckboxInput() {
+	async getCheckboxInput(): Promise< ElementHandle< Element > | null > {
 		return this.page.$(
 			`${ this.selector } .components-form-toggle__input`
 		);
 	}
 
-	async isEnabled() {
+	async isEnabled(): Promise< void > {
 		await this.page.waitForSelector(
 			`${ this.selector } .components-form-toggle.is-checked`
 		);

plugins/woocommerce-admin/packages/admin-e2e-tests/src/elements/HelpMenu.ts

@@ -15,17 +15,17 @@ export class HelpMenu extends BaseElement {
 		super( page, '' );
 	}
 
-	async openHelpMenu() {
+	async openHelpMenu(): Promise< void > {
 		const el = await getElementByText( 'button', 'Help' );
 		await el?.click();
 	}
 
-	async openSetupWizardTab() {
+	async openSetupWizardTab(): Promise< void > {
 		const el = await waitForElementByText( '*', 'Setup wizard' );
 		await el?.click();
 	}
 
-	async enableTaskList() {
+	async enableTaskList(): Promise< void > {
 		await this.openSetupWizardTab();
 
 		const enableLink = await getElementByText(

plugins/woocommerce-admin/packages/admin-e2e-tests/src/fixtures/options.ts

@@ -5,14 +5,17 @@ import { httpClient } from './http-client';
 
 const optionsEndpoint = '/wc-admin/options';
 
-export async function updateOption( optionName: string, optionValue: string ) {
+export async function updateOption(
+	optionName: string,
+	optionValue: string
+): Promise< void > {
 	const response = await httpClient.post( optionsEndpoint, {
 		[ optionName ]: optionValue,
 	} );
 	expect( response.statusCode ).toEqual( 200 );
 }
 
-export async function unhideTaskList( id: string ) {
+export async function unhideTaskList( id: string ): Promise< void > {
 	const response = await httpClient.post(
 		`/wc-admin/onboarding/tasks/${ id }/unhide`
 	);

plugins/woocommerce-admin/packages/admin-e2e-tests/src/fixtures/orders.ts

@@ -9,7 +9,7 @@ import { httpClient } from './http-client';
 
 const repository = Order.restRepository( httpClient );
 
-export async function createOrder( status = 'completed' ) {
+export async function createOrder( status = 'completed' ): Promise< Order > {
 	// The repository can now be used to create models.
 	return await repository.create( {
 		paymentMethod: 'cod',
@@ -17,7 +17,7 @@ export async function createOrder( status = 'completed' ) {
 	} );
 }
 
-export async function removeAllOrders() {
+export async function removeAllOrders(): Promise< ( boolean | undefined )[] > {
 	const products = await repository.list();
 	return await Promise.all(
 		products

plugins/woocommerce-admin/packages/admin-e2e-tests/src/pages/Analytics.ts

@@ -21,11 +21,11 @@ export class Analytics extends BasePage {
 	url = 'wp-admin/admin.php?page=wc-admin&path=%2Fanalytics%2Foverview';
 
 	// If you need to go to a specific single page of the analytics use `navigateToSection`
-	async navigateToSection( section: AnalyticsSection ) {
+	async navigateToSection( section: AnalyticsSection ): Promise< void > {
 		await this.goto( this.url.replace( 'overview', section ) );
 	}
 
-	async isDisplayed() {
+	async isDisplayed(): Promise< void > {
 		// This is a smoke test that ensures the single page was rendered without crashing
 		await this.page.waitForSelector( '#woocommerce-layout__primary' );
 	}

plugins/woocommerce-admin/packages/admin-e2e-tests/src/pages/AnalyticsOverview.ts

@@ -21,11 +21,11 @@ const isSection = ( item: Section | undefined ): item is Section => {
 };
 
 export class AnalyticsOverview extends Analytics {
-	async navigate() {
+	async navigate(): Promise< void > {
 		await this.navigateToSection( 'overview' );
 	}
 
-	async getSections() {
+	async getSections(): Promise< Section[] > {
 		const list = await this.page.$$(
 			'.woocommerce-dashboard-section .woocommerce-section-header'
 		);
@@ -47,14 +47,14 @@ export class AnalyticsOverview extends Analytics {
 		return sections.filter( isSection );
 	}
 
-	async getSectionTitles() {
+	async getSectionTitles(): Promise< string[] > {
 		const sections = ( await this.getSections() ).map(
 			( section ) => section.title
 		);
 		return sections;
 	}
 
-	async openSectionEllipsis( sectionTitle: string ) {
+	async openSectionEllipsis( sectionTitle: string ): Promise< void > {
 		const section = ( await this.getSections() ).find(
 			( thisSection ) => thisSection.title === sectionTitle
 		);
@@ -69,7 +69,7 @@ export class AnalyticsOverview extends Analytics {
 		}
 	}
 
-	async closeSectionEllipsis( sectionTitle: string ) {
+	async closeSectionEllipsis( sectionTitle: string ): Promise< void > {
 		const section = ( await this.getSections() ).find(
 			( thisSection ) => thisSection.title === sectionTitle
 		);
@@ -87,13 +87,13 @@ export class AnalyticsOverview extends Analytics {
 		}
 	}
 
-	async removeSection( sectionTitle: string ) {
+	async removeSection( sectionTitle: string ): Promise< void > {
 		await this.openSectionEllipsis( sectionTitle );
 		const item = await waitForElementByText( 'div', 'Remove section' );
 		await item?.click();
 	}
 
-	async addSection( sectionTitle: string ) {
+	async addSection( sectionTitle: string ): Promise< void > {
 		await this.page.waitForSelector( "button[title='Add more sections']" );
 		await this.page.click( "button[title='Add more sections']" );
 		const addSectionSelector = `button[title='Add ${ sectionTitle } section']`;
@@ -102,19 +102,23 @@ export class AnalyticsOverview extends Analytics {
 		await this.page.click( addSectionSelector );
 	}
 
-	async moveSectionDown( sectionTitle: string ) {
+	async moveSectionDown( sectionTitle: string ): Promise< void > {
 		await this.openSectionEllipsis( sectionTitle );
 		const item = await waitForElementByText( 'div', 'Move down' );
 		await item?.click();
 	}
 
-	async moveSectionUp( sectionTitle: string ) {
+	async moveSectionUp( sectionTitle: string ): Promise< void > {
 		await this.openSectionEllipsis( sectionTitle );
 		const item = await waitForElementByText( 'div', 'Move up' );
 		await item?.click();
 	}
 
-	async getEllipsisMenuItems( sectionTitle: string ) {
+	async getEllipsisMenuItems(
+		sectionTitle: string
+	): Promise<
+		{ title: string | null; element: ElementHandle< Element > }[]
+	> {
 		await this.openSectionEllipsis( sectionTitle );
 		const list = await this.page.$$(
 			'.woocommerce-ellipsis-menu div[role=menuitem]'
@@ -129,7 +133,11 @@ export class AnalyticsOverview extends Analytics {
 		);
 	}
 
-	async getEllipsisMenuCheckboxItems( sectionTitle: string ) {
+	async getEllipsisMenuCheckboxItems(
+		sectionTitle: string
+	): Promise<
+		{ title: string | null; element: ElementHandle< Element > }[]
+	> {
 		await this.openSectionEllipsis( sectionTitle );
 		const list = await this.page.$$(
 			'.woocommerce-ellipsis-menu div[role=menuitemcheckbox]'

plugins/woocommerce-admin/packages/admin-e2e-tests/src/pages/BasePage.ts

@@ -34,7 +34,7 @@ export abstract class BasePage {
 		this.page = page;
 	}
 
-	getDropdownField( selector: string ) {
+	getDropdownField( selector: string ): DropdownField {
 		if ( ! this.dropDownElements[ selector ] ) {
 			this.dropDownElements[ selector ] = new DropdownField(
 				page,
@@ -45,7 +45,7 @@ export abstract class BasePage {
 		return this.dropDownElements[ selector ];
 	}
 
-	getDropdownTypeahead( selector: string ) {
+	getDropdownTypeahead( selector: string ): DropdownTypeaheadField {
 		if ( ! this.dropDownTypeAheadElements[ selector ] ) {
 			this.dropDownTypeAheadElements[
 				selector
@@ -55,7 +55,7 @@ export abstract class BasePage {
 		return this.dropDownTypeAheadElements[ selector ];
 	}
 
-	getFormToggle( selector: string ) {
+	getFormToggle( selector: string ): FormToggle {
 		if ( ! this.formToggleElements[ selector ] ) {
 			this.formToggleElements[ selector ] = new FormToggle(
 				page,
@@ -66,22 +66,25 @@ export abstract class BasePage {
 		return this.formToggleElements[ selector ];
 	}
 
-	async click( selector: string ) {
+	async click( selector: string ): Promise< void > {
 		await this.page.waitForSelector( selector );
 		await this.page.click( selector );
 	}
 
-	async clickButtonWithText( text: string ) {
+	async clickButtonWithText( text: string ): Promise< void > {
 		const el = await getElementByText( 'button', text );
 		await el?.click();
 	}
 
-	async clickElementWithText( element: string, text: string ) {
+	async clickElementWithText(
+		element: string,
+		text: string
+	): Promise< void > {
 		const el = await getElementByText( element, text );
 		await el?.click();
 	}
 
-	async setCheckboxWithText( text: string ) {
+	async setCheckboxWithText( text: string ): Promise< void > {
 		let checkbox = await getElementByText( 'label', text );
 
 		if ( ! checkbox ) {
@@ -101,7 +104,7 @@ export abstract class BasePage {
 		}
 	}
 
-	async unsetAllCheckboxes( selector: string ) {
+	async unsetAllCheckboxes( selector: string ): Promise< void > {
 		const checkboxes = await page.$$( selector );
 		// Uncheck all checkboxes, to avoid installing plugins
 		for ( const checkbox of checkboxes ) {
@@ -110,7 +113,7 @@ export abstract class BasePage {
 		}
 	}
 
-	async setAllCheckboxes( selector: string ) {
+	async setAllCheckboxes( selector: string ): Promise< void > {
 		const checkboxes = await page.$$( selector );
 		// Uncheck all checkboxes, to avoid installing plugins
 		for ( const checkbox of checkboxes ) {
@@ -123,7 +126,7 @@ export abstract class BasePage {
 	async toggleCheckbox(
 		checkbox: ElementHandle< Element >,
 		checked: boolean
-	) {
+	): Promise< void > {
 		const checkboxStatus = await (
 			await checkbox.getProperty( 'checked' )
 		 ).jsonValue();
@@ -133,7 +136,7 @@ export abstract class BasePage {
 		}
 	}
 
-	async navigate() {
+	async navigate(): Promise< void > {
 		if ( ! this.url ) {
 			throw new Error( 'You must define a url for the page object' );
 		}
@@ -141,7 +144,7 @@ export abstract class BasePage {
 		await this.goto( this.url );
 	}
 
-	protected async goto( url: string ) {
+	protected async goto( url: string ): Promise< void > {
 		const fullUrl = baseUrl + url;
 		try {
 			await this.page.goto( fullUrl, {

plugins/woocommerce-admin/packages/admin-e2e-tests/src/pages/Coupons.ts

@@ -6,7 +6,7 @@ import { BasePage } from './BasePage';
 export class Coupons extends BasePage {
 	url = 'wp-admin/edit.php?post_type=shop_coupon&legacy_coupon_menu=1';
 
-	async isDisplayed() {
+	async isDisplayed(): Promise< void > {
 		// This is a smoke test that ensures the single page was rendered without crashing
 		await this.page.waitForSelector( '#woocommerce-layout__primary' );
 	}

plugins/woocommerce-admin/packages/admin-e2e-tests/src/pages/Login.ts

@@ -11,7 +11,7 @@ const config = require( 'config' );
 export class Login extends BasePage {
 	url = 'wp-login.php';
 
-	async login() {
+	async login(): Promise< void > {
 		await this.navigate();
 
 		await getElementByText( 'label', 'Username or Email Address' );
@@ -35,7 +35,7 @@ export class Login extends BasePage {
 		] );
 	}
 
-	async logout() {
+	async logout(): Promise< void > {
 		// Log out link in admin bar is not visible so can't be clicked directly.
 		const logoutLinks = await this.page.$$eval(
 			'#wp-admin-bar-logout a',

plugins/woocommerce-admin/packages/admin-e2e-tests/src/pages/OnboardingWizard.ts

@@ -34,16 +34,16 @@ export class OnboardingWizard extends BasePage {
 		this.themes = new ThemeSection( page );
 	}
 
-	async skipStoreSetup() {
+	async skipStoreSetup(): Promise< void > {
 		await this.clickButtonWithText( 'Skip setup store details' );
 		await this.optionallySelectUsageTracking( false );
 	}
 
-	async continue() {
+	async continue(): Promise< void > {
 		await this.clickButtonWithText( 'Continue' );
 	}
 
-	async optionallySelectUsageTracking( select = false ) {
+	async optionallySelectUsageTracking( select = false ): Promise< void > {
 		const usageTrackingHeader = await this.page.waitForSelector(
 			'.components-modal__header-heading',
 			{
@@ -76,7 +76,7 @@ export class OnboardingWizard extends BasePage {
 		} );
 	}
 
-	async goToOBWStep( step: string ) {
+	async goToOBWStep( step: string ): Promise< void > {
 		await this.clickElementWithText( 'span', step );
 	}
 }

plugins/woocommerce-admin/packages/admin-e2e-tests/src/pages/PaymentsSetup.ts

@@ -1,11 +1,7 @@
 /**
  * Internal dependencies
  */
-import {
-	waitForElementByText,
-	getElementByText,
-	waitForTimeout,
-} from '../utils/actions';
+import { waitForElementByText, getElementByText } from '../utils/actions';
 import { BasePage } from './BasePage';
 
 type PaymentMethodWithSetupButton =
@@ -21,15 +17,17 @@ type PaymentMethod = PaymentMethodWithSetupButton | 'cod';
 export class PaymentsSetup extends BasePage {
 	url = 'wp-admin/admin.php?page=wc-admin&task=payments';
 
-	async isDisplayed() {
+	async isDisplayed(): Promise< void > {
 		await waitForElementByText( 'h1', 'Set up payments' );
 	}
 
-	async closeHelpModal() {
+	async closeHelpModal(): Promise< void > {
 		await this.clickButtonWithText( 'Got it' );
 	}
 
-	async goToPaymentMethodSetup( method: PaymentMethodWithSetupButton ) {
+	async goToPaymentMethodSetup(
+		method: PaymentMethodWithSetupButton
+	): Promise< void > {
 		const selector = `.woocommerce-task-payment-${ method } button`;
 		await this.page.waitForSelector( selector );
 		const button = await this.page.$( selector );
@@ -43,7 +41,7 @@ export class PaymentsSetup extends BasePage {
 		}
 	}
 
-	async methodHasBeenSetup( method: PaymentMethod ) {
+	async methodHasBeenSetup( method: PaymentMethod ): Promise< void > {
 		const selector = `.woocommerce-task-payment-${ method }`;
 		await this.page.waitForSelector( selector );
 		expect(
@@ -51,7 +49,7 @@ export class PaymentsSetup extends BasePage {
 		).toBeDefined();
 	}
 
-	async enableCashOnDelivery() {
+	async enableCashOnDelivery(): Promise< void > {
 		await this.page.waitForSelector( '.woocommerce-task-payment-cod' );
 		await this.clickButtonWithText( 'Enable' );
 	}

plugins/woocommerce-admin/packages/admin-e2e-tests/src/pages/ProductsSetup.ts

@@ -7,11 +7,13 @@ import { BasePage } from './BasePage';
 export class ProductsSetup extends BasePage {
 	url = 'wp-admin/admin.php?page=wc-admin&task=products';
 
-	async isDisplayed() {
+	async isDisplayed(): Promise< void > {
 		await waitForElementByText( 'h1', 'Add my products' );
 	}
 
-	async isStartWithATemplateDisplayed( templatesCount: number ) {
+	async isStartWithATemplateDisplayed(
+		templatesCount: number
+	): Promise< void > {
 		await waitForElementByText( 'h1', 'Start with a template' );
 		const length = await this.page.$$eval(
 			'.components-radio-control__input',
@@ -20,7 +22,7 @@ export class ProductsSetup extends BasePage {
 		expect( length === templatesCount ).toBeTruthy();
 	}
 
-	async clickStartWithTemplate() {
+	async clickStartWithTemplate(): Promise< void > {
 		await this.clickElementWithText( '*', 'Start with a template' );
 	}
 }

plugins/woocommerce-admin/packages/admin-e2e-tests/src/pages/WcSettings.ts

@@ -11,7 +11,7 @@ const { setCheckbox } = require( '@woocommerce/e2e-utils' );
 export class WcSettings extends BasePage {
 	url = 'wp-admin/admin.php?page=wc-settings';
 
-	async navigate( tab = 'general', section = '' ) {
+	async navigate( tab = 'general', section = '' ): Promise< void > {
 		let settingsUrl = this.url + `&tab=${ tab }`;
 
 		if ( section ) {
@@ -22,16 +22,16 @@ export class WcSettings extends BasePage {
 		await waitForElementByText( 'a', 'General' );
 	}
 
-	async enableTaxRates() {
+	async enableTaxRates(): Promise< void > {
 		await waitForElementByText( 'th', 'Enable taxes' );
 		await setCheckbox( '#woocommerce_calc_taxes' );
 	}
 
-	async getTaxRateValue() {
+	async getTaxRateValue(): Promise< unknown > {
 		return await getAttribute( '#woocommerce_calc_taxes', 'checked' );
 	}
 
-	async saveSettings() {
+	async saveSettings(): Promise< void > {
 		this.clickButtonWithText( 'Save changes' );
 		await this.page.waitForNavigation( {
 			waitUntil: 'networkidle0',
@@ -42,7 +42,7 @@ export class WcSettings extends BasePage {
 		);
 	}
 
-	async cleanPaymentMethods() {
+	async cleanPaymentMethods(): Promise< void > {
 		this.navigate( 'checkout' );
 		await waitForElementByText( 'h2', 'Payment methods' );
 		const paymentMethods = await page.$$( 'span.woocommerce-input-toggle' );

plugins/woocommerce-admin/packages/admin-e2e-tests/src/pages/WpSettings.ts

@@ -7,11 +7,11 @@ import { BasePage } from './BasePage';
 export class WpSettings extends BasePage {
 	url = 'wp-admin/options-permalink.php';
 
-	async openPermalinkSettings() {
+	async openPermalinkSettings(): Promise< void > {
 		await waitForElementByText( 'h1', 'Permalink Settings' );
 	}
 
-	async saveSettings() {
+	async saveSettings(): Promise< void > {
 		await this.click( '#submit' );
 		await this.page.waitForNavigation( {
 			waitUntil: 'networkidle0',

plugins/woocommerce-admin/packages/admin-e2e-tests/src/sections/onboarding/BusinessSection.ts

@@ -14,15 +14,15 @@ const {
 /* eslint-enable @typescript-eslint/no-var-requires */
 
 export class BusinessSection extends BasePage {
-	async isDisplayed() {
+	async isDisplayed(): Promise< void > {
 		await waitForElementByText( 'h2', 'Tell us about your business' );
 	}
 
-	async freeFeaturesIsDisplayed() {
+	async freeFeaturesIsDisplayed(): Promise< void > {
 		await waitForElementByText( 'h2', 'Included business features' );
 	}
 
-	async selectProductNumber( productLabel: string ) {
+	async selectProductNumber( productLabel: string ): Promise< void > {
 		const howManyProductsDropdown = this.getDropdownField(
 			'.woocommerce-profile-wizard__product-count'
 		);
@@ -30,7 +30,7 @@ export class BusinessSection extends BasePage {
 		await howManyProductsDropdown.select( productLabel );
 	}
 
-	async selectCurrentlySelling( currentlySelling: string ) {
+	async selectCurrentlySelling( currentlySelling: string ): Promise< void > {
 		const sellingElsewhereDropdown = this.getDropdownField(
 			'.woocommerce-profile-wizard__selling-venues'
 		);
@@ -59,7 +59,9 @@ export class BusinessSection extends BasePage {
 		await otherPlatformNameDropdown.select( otherPlatformName );
 	}
 
-	async selectInstallFreeBusinessFeatures( select: boolean ) {
+	async selectInstallFreeBusinessFeatures(
+		select: boolean
+	): Promise< void > {
 		if ( select ) {
 			await setCheckbox( '#woocommerce-business-extensions__checkbox' );
 		} else {
@@ -67,7 +69,7 @@ export class BusinessSection extends BasePage {
 		}
 	}
 
-	async expandRecommendedBusinessFeatures() {
+	async expandRecommendedBusinessFeatures(): Promise< void > {
 		const expandButtonSelector =
 			'.woocommerce-admin__business-details__selective-extensions-bundle__expand';
 
@@ -85,22 +87,22 @@ export class BusinessSection extends BasePage {
 		} );
 	}
 
-	async uncheckAllRecommendedBusinessFeatures() {
+	async uncheckAllRecommendedBusinessFeatures(): Promise< void > {
 		await this.unsetAllCheckboxes( '.components-checkbox-control__input' );
 	}
 
 	// The old list displayed on the dropdown page
-	async uncheckBusinessFeatures() {
+	async uncheckBusinessFeatures(): Promise< void > {
 		await this.unsetAllCheckboxes(
 			'.woocommerce-profile-wizard__benefit .components-form-toggle__input'
 		);
 	}
 
-	async selectSetupForClient() {
+	async selectSetupForClient(): Promise< void > {
 		await setCheckbox( '.components-checkbox-control__input' );
 	}
 
-	async checkClientSetupCheckbox( selected: boolean ) {
+	async checkClientSetupCheckbox( selected: boolean ): Promise< void > {
 		if ( selected ) {
 			await verifyCheckboxIsSet( '.components-checkbox-control__input' );
 		} else {

plugins/woocommerce-admin/packages/admin-e2e-tests/src/sections/onboarding/IndustrySection.ts

@@ -5,7 +5,10 @@ import { BasePage } from '../../pages/BasePage';
 import { waitForElementByText } from '../../utils/actions';
 
 export class IndustrySection extends BasePage {
-	async isDisplayed( industryCount?: number, industryCountMax?: number ) {
+	async isDisplayed(
+		industryCount?: number,
+		industryCountMax?: number
+	): Promise< void > {
 		await waitForElementByText(
 			'h2',
 			'In which industry does the store operate?'
@@ -27,11 +30,11 @@ export class IndustrySection extends BasePage {
 		}
 	}
 
-	async uncheckIndustries() {
+	async uncheckIndustries(): Promise< void > {
 		await this.unsetAllCheckboxes( '.components-checkbox-control__input' );
 	}
 
-	async selectIndustry( industryLabel: string ) {
+	async selectIndustry( industryLabel: string ): Promise< void > {
 		await this.setCheckboxWithText( industryLabel );
 	}
 }

plugins/woocommerce-admin/packages/admin-e2e-tests/src/sections/onboarding/ProductTypesSection.ts

@@ -5,7 +5,7 @@ import { BasePage } from '../../pages/BasePage';
 import { waitForElementByText } from '../../utils/actions';
 
 export class ProductTypeSection extends BasePage {
-	async isDisplayed( productCount: number ) {
+	async isDisplayed( productCount: number ): Promise< void > {
 		await waitForElementByText(
 			'h2',
 			'What type of products will be listed?'
@@ -17,11 +17,11 @@ export class ProductTypeSection extends BasePage {
 		expect( length === productCount ).toBeTruthy();
 	}
 
-	async uncheckProducts() {
+	async uncheckProducts(): Promise< void > {
 		await this.unsetAllCheckboxes( '.components-checkbox-control__input' );
 	}
 
-	async selectProduct( productLabel: string ) {
+	async selectProduct( productLabel: string ): Promise< void > {
 		await this.setCheckboxWithText( productLabel );
 	}
 }

plugins/woocommerce-admin/packages/admin-e2e-tests/src/sections/onboarding/StoreDetailsSection.ts

@@ -30,11 +30,13 @@ export class StoreDetailsSection extends BasePage {
 		return this.getDropdownTypeahead( '#woocommerce-select-control' );
 	}
 
-	async isDisplayed() {
+	async isDisplayed(): Promise< void > {
 		await waitForElementByText( 'h2', 'Welcome to WooCommerce' );
 	}
 
-	async completeStoreDetailsSection( storeDetails: StoreDetails = {} ) {
+	async completeStoreDetailsSection(
+		storeDetails: StoreDetails = {}
+	): Promise< void > {
 		// const onboardingWizard = new OnboardingWizard( page );
 		// Fill store's address - first line
 		await this.fillAddress(
@@ -81,36 +83,36 @@ export class StoreDetailsSection extends BasePage {
 		await this.checkMarketingCheckbox( true );
 	}
 
-	async fillAddress( address: string ) {
+	async fillAddress( address: string ): Promise< void > {
 		await clearAndFillInput( '#inspector-text-control-0', address );
 	}
 
-	async fillAddressLineTwo( address: string ) {
+	async fillAddressLineTwo( address: string ): Promise< void > {
 		await clearAndFillInput( '#inspector-text-control-1', address );
 	}
 
-	async selectCountry( search: string, selector: string ) {
+	async selectCountry( search: string, selector: string ): Promise< void > {
 		await this.countryDropdown.search( search );
 		await this.countryDropdown.select( selector );
 	}
 
-	async checkCountrySelected( country: string ) {
+	async checkCountrySelected( country: string ): Promise< void > {
 		await this.countryDropdown.checkSelected( country );
 	}
 
-	async fillCity( city: string ) {
+	async fillCity( city: string ): Promise< void > {
 		await clearAndFillInput( '#inspector-text-control-2', city );
 	}
 
-	async fillPostalCode( postalCode: string ) {
+	async fillPostalCode( postalCode: string ): Promise< void > {
 		await clearAndFillInput( '#inspector-text-control-3', postalCode );
 	}
 
-	async fillEmailAddress( email: string ) {
+	async fillEmailAddress( email: string ): Promise< void > {
 		await clearAndFillInput( '#inspector-text-control-4', email );
 	}
 
-	async checkMarketingCheckbox( selected: boolean ) {
+	async checkMarketingCheckbox( selected: boolean ): Promise< void > {
 		if ( selected ) {
 			await verifyCheckboxIsSet( '.components-checkbox-control__input' );
 		} else {

plugins/woocommerce-admin/packages/admin-e2e-tests/src/sections/onboarding/ThemeSection.ts

@@ -5,12 +5,12 @@ import { BasePage } from '../../pages/BasePage';
 import { waitForElementByText } from '../../utils/actions';
 
 export class ThemeSection extends BasePage {
-	async isDisplayed() {
+	async isDisplayed(): Promise< void > {
 		await waitForElementByText( 'h2', 'Choose a theme' );
 		await waitForElementByText( 'button', 'All themes' );
 	}
 
-	async continueWithActiveTheme() {
+	async continueWithActiveTheme(): Promise< void > {
 		await this.clickButtonWithText( 'Continue with my active theme' );
 	}
 }

plugins/woocommerce-admin/packages/admin-e2e-tests/src/sections/payment-setup/BankAccountTransferSetup.ts

@@ -26,7 +26,7 @@ export class BankAccountTransferSetup extends BasePage {
 		sortCode,
 		iban,
 		swiftCode,
-	}: AccountDetails ) {
+	}: AccountDetails ): Promise< void > {
 		await clearAndFillInput( '[placeholder="Account name"]', accountName );
 		await clearAndFillInput(
 			'[placeholder="Account number"]',

plugins/woocommerce-admin/packages/admin-e2e-tests/src/utils/actions.ts

@@ -16,7 +16,7 @@ const config = require( 'config' );
 /**
  * Wait for UI blocking to end.
  */
-const uiUnblocked = async () => {
+const uiUnblocked = async (): Promise< void > => {
 	await page.waitForFunction(
 		() => ! Boolean( document.querySelector( '.blockUI' ) )
 	);
@@ -27,7 +27,7 @@ const uiUnblocked = async () => {
  *
  * @param {number} timeout in milliseconds
  */
-const waitForTimeout = async ( timeout: number ) => {
+const waitForTimeout = async ( timeout: number ): Promise< void > => {
 	await new Promise( ( resolve ) => setTimeout( resolve, timeout ) );
 };
 
@@ -43,7 +43,7 @@ const verifyPublishAndTrash = async (
 	publishNotice: string,
 	publishVerification: string,
 	trashVerification: string
-) => {
+): Promise< void > => {
 	// Wait for auto save
 	await waitForTimeout( 2000 );
 	// Publish
@@ -77,14 +77,17 @@ const verifyPublishAndTrash = async (
 	} );
 };
 
-const hasClass = async ( element: ElementHandle, elementClass: string ) => {
+const hasClass = async (
+	element: ElementHandle,
+	elementClass: string
+): Promise< boolean > => {
 	const classNameProp = await element.getProperty( 'className' );
 	const classNameValue = ( await classNameProp.jsonValue() ) as string;
 
 	return classNameValue.includes( elementClass );
 };
 
-const getInputValue = async ( selector: string ) => {
+const getInputValue = async ( selector: string ): Promise< unknown > => {
 	const field = await page.$( selector );
 	if ( field ) {
 		const fieldValue = await (
@@ -96,7 +99,10 @@ const getInputValue = async ( selector: string ) => {
 	return null;
 };
 
-const getAttribute = async ( selector: string, attribute: string ) => {
+const getAttribute = async (
+	selector: string,
+	attribute: string
+): Promise< unknown > => {
 	await page.focus( selector );
 	const field = await page.$( selector );
 	if ( field ) {
@@ -156,7 +162,7 @@ export const waitForElementByTextWithoutThrow = async (
 	element: string,
 	text: string,
 	timeoutInSeconds = 5
-) => {
+): Promise< boolean > => {
 	let selected = await getElementByText( element, text );
 	for ( let s = 0; s < timeoutInSeconds; s++ ) {
 		if ( selected ) {
@@ -197,7 +203,9 @@ const waitUntilElementStopsMoving = async ( selector: string ) => {
 	);
 };
 
-const deactivateAndDeleteExtension = async ( extension: string ) => {
+const deactivateAndDeleteExtension = async (
+	extension: string
+): Promise< void > => {
 	const baseUrl = config.get( 'url' );
 	const pluginsAdmin = 'wp-admin/plugins.php?plugin_status=all&paged=1&s';
 	await page.goto( baseUrl + pluginsAdmin, {