chore(test): define the correct provider type locator (podman-desktop…

…#9520) * chore(test): provider type locator Signed-off-by: Anton Misskii <[email protected]> * Update tests/playwright/src/model/pages/create-kind-cluster-page.ts Co-authored-by: Vladimir Lazar <[email protected]> Signed-off-by: Anton Misskii <[email protected]> * fix: aria-label Signed-off-by: Anton Misskii <[email protected]> * fix: fix Signed-off-by: Anton Misskii <[email protected]> * fix: fix Signed-off-by: Anton Misskii <[email protected]> --------- Signed-off-by: Anton Misskii <[email protected]> Co-authored-by: Vladimir Lazar <[email protected]>
feloy · Oct 22, 2024 · 6e40f4b · 6e40f4b
1 parent 1ebf775
commit 6e40f4b
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 11 deletions.
diff --git a/packages/ui/src/lib/dropdown/Dropdown.svelte b/packages/ui/src/lib/dropdown/Dropdown.svelte
@@ -191,6 +191,7 @@ function onWindowClick(e: Event): void {
     class:group-hover-placeholder:text-[color:var(--pd-input-field-placeholder-text)]={!disabled}
     disabled={disabled}
     id={id}
+    aria-label={`${ariaLabel} Button`}
     name={name}
     onclick={toggleOpen}
     onkeydown={onKeyDown}>

diff --git a/tests/playwright/src/model/pages/create-kind-cluster-page.ts b/tests/playwright/src/model/pages/create-kind-cluster-page.ts
@@ -30,7 +30,7 @@ export class CreateKindClusterPage extends BasePage {
   readonly clusterCreationButton: Locator;
   readonly goBackButton: Locator;
   readonly logsButton: Locator;
-  readonly providerTypeCombobox: Locator;
+  readonly providerTypeButton: Locator;
   readonly httpPort: Locator;
   readonly httpsPort: Locator;
   readonly containerImage: Locator;
@@ -50,7 +50,7 @@ export class CreateKindClusterPage extends BasePage {
       .locator('..');
     this.clusterCreationButton = this.clusterPropertiesInformation.getByRole('button', { name: 'Create', exact: true });
     this.logsButton = this.content.getByRole('button', { name: 'Show Logs' });
-    this.providerTypeCombobox = this.clusterPropertiesInformation.getByRole('combobox', { name: 'Provider Type' });
+    this.providerTypeButton = this.clusterPropertiesInformation.getByRole('button', { name: 'Provider Type Button' });
     this.httpPort = this.clusterPropertiesInformation.getByLabel('HTTP Port');
     this.httpsPort = this.clusterPropertiesInformation.getByLabel('HTTPS Port');
     this.containerImage = this.clusterPropertiesInformation.getByPlaceholder('Leave empty for using latest.');
@@ -60,10 +60,15 @@ export class CreateKindClusterPage extends BasePage {
 
   public async createClusterDefault(clusterName: string = 'kind-cluster', timeout?: number): Promise<void> {
     await this.fillTextbox(this.clusterNameField, clusterName);
-    await playExpect(this.providerTypeCombobox).toHaveValue('podman');
+    await playExpect(this.providerTypeButton).toBeEnabled();
+    await playExpect(this.providerTypeButton).toHaveText('podman');
+    await playExpect(this.httpPort).toBeVisible();
     await playExpect(this.httpPort).toHaveValue('9090');
+    await playExpect(this.httpsPort).toBeVisible();
     await playExpect(this.httpsPort).toHaveValue('9443');
+    await playExpect(this.controllerCheckbox).toBeVisible();
     await playExpect(this.controllerCheckbox).toBeChecked();
+    await playExpect(this.containerImage).toBeVisible();
     await playExpect(this.containerImage).toBeEmpty();
     await this.createCluster(timeout);
   }
@@ -76,14 +81,12 @@ export class CreateKindClusterPage extends BasePage {
     await this.fillTextbox(this.clusterNameField, clusterName);
 
     if (providerType) {
-      await playExpect(this.providerTypeCombobox).toBeVisible();
-      const providerTypeOptions = await this.providerTypeCombobox.locator('option').allInnerTexts();
-      if (providerTypeOptions.includes(providerType)) {
-        await this.providerTypeCombobox.selectOption({ value: providerType });
-        await playExpect(this.providerTypeCombobox).toHaveValue(providerType);
-      } else {
-        throw new Error(`${providerType} doesn't exist`);
-      }
+      await playExpect(this.providerTypeButton).toBeEnabled();
+      await this.providerTypeButton.click();
+      const providerTypeOption = this.page.getByRole('button', { name: providerType, exact: true });
+      await playExpect(providerTypeOption).toBeEnabled();
+      await providerTypeOption.click();
+      await playExpect(this.providerTypeButton).toHaveText(providerType);
     }
 
     if (httpPort) {