test: shareview framework (wip)

Signed-off-by: Raju Udava <86527202+dstala@users.noreply.github.com>

packages/nc-gui/components/smartsheet/toolbar/ShareView.vue

@@ -213,6 +213,7 @@ watch(passwordProtected, (value) => {
     >
       <div
         data-cy="nc-modal-share-view__link"
+        data-pw="nc-modal-share-view__link"
         class="share-link-box !bg-primary !bg-opacity-5 ring-1 ring-accent ring-opacity-100"
       >
         <div class="flex-1 h-min text-xs">{{ sharedViewUrl }}</div>
@@ -235,6 +236,7 @@ watch(passwordProtected, (value) => {
               v-if="shared.type === ViewTypes.FORM"
               v-model:checked="surveyMode"
               data-cy="nc-modal-share-view__survey-mode"
+              data-pw="nc-modal-share-view__survey-mode"
               class="!text-sm"
             >
               Use Survey Mode
@@ -265,6 +267,7 @@ watch(passwordProtected, (value) => {
               v-if="shared.type === ViewTypes.FORM"
               v-model:checked="viewTheme"
               data-cy="nc-modal-share-view__with-theme"
+              data-pw="nc-modal-share-view__with-theme"
               class="!text-sm"
             >
               Use Theme
@@ -279,6 +282,7 @@ watch(passwordProtected, (value) => {
                   :colors="projectThemeColors"
                   :row-size="9"
                   :advanced="false"
+                  data-pw="nc-modal-share-view__theme-picker"
                   @input="onChangeTheme"
                 />
               </div>
@@ -287,7 +291,12 @@ watch(passwordProtected, (value) => {
 
           <div>
             <!-- Password Protection -->
-            <a-checkbox v-model:checked="passwordProtected" data-cy="nc-modal-share-view__with-password" class="!text-sm !my-1">
+            <a-checkbox
+              v-model:checked="passwordProtected"
+              data-cy="nc-modal-share-view__with-password"
+              class="!text-sm !my-1"
+              data-pw="nc-modal-share-view__with-password"
+            >
               {{ $t('msg.info.beforeEnablePwd') }}
             </a-checkbox>
 
@@ -296,6 +305,7 @@ watch(passwordProtected, (value) => {
                 <a-input
                   v-model:value="shared.password"
                   data-cy="nc-modal-share-view__password"
+                  data-pw="nc-modal-share-view__password"
                   size="small"
                   class="!text-xs max-w-[250px]"
                   type="password"
@@ -304,6 +314,7 @@ watch(passwordProtected, (value) => {
 
                 <a-button
                   data-cy="nc-modal-share-view__save-password"
+                  data-pw="nc-modal-share-view__save-password"
                   size="small"
                   class="!text-xs"
                   @click="saveShareLinkPassword"
@@ -323,6 +334,7 @@ watch(passwordProtected, (value) => {
               "
               v-model:checked="allowCSVDownload"
               data-cy="nc-modal-share-view__with-csv-download"
+              data-pw="nc-modal-share-view__with-csv-download"
               class="!text-sm"
             >
               {{ $t('labels.downloadAllowed') }}

scripts/playwright/pages/Dashboard/Grid/Toolbar/ShareView.ts

@@ -0,0 +1,39 @@
+import BasePage from "../../../Base";
+import { ToolbarPage } from ".";
+
+export class ToolbarShareViewPage extends BasePage {
+  readonly toolbar: ToolbarPage;
+
+  constructor(toolbar: ToolbarPage) {
+    super(toolbar.rootPage);
+    this.toolbar = toolbar;
+  }
+
+  get() {
+    return this.rootPage.locator(`.nc-modal-share-view`);
+  }
+
+  async enablePassword() {
+    await this.get()
+      .locator(`[data-pw="nc-modal-share-view__with-password"`)
+      .click();
+  }
+
+  async disablePassword() {
+    await this.get()
+      .locator(`[data-pw="nc-modal-share-view__with-password"`)
+      .click();
+  }
+
+  async toggleDownload() {
+    await this.get()
+      .locator(`[data-pw="nc-modal-share-view__with-csv-download"]`)
+      .click();
+  }
+
+  async getShareLink() {
+    return this.get()
+      .locator(`[data-pw="nc-modal-share-view__link"]`)
+      .innerText();
+  }
+}

scripts/playwright/pages/Dashboard/Grid/Toolbar/index.ts

@@ -34,4 +34,11 @@ export class ToolbarPage extends BasePage {
     await this.get().locator(`button:has-text("Filter")`).click();
   }
 
-}
+  async clickShareView() {
+    await this.get().locator(`button:has-text("Share View")`).click();
+  }
+
+  async clickAddNewRow() {
+    await this.get().locator(`.nc-toolbar-btn.nc-add-new-row-btn")`).click();
+  }
+}