[test] Add org and app test

components/CreateAppDialog.vue

@@ -51,16 +51,16 @@ const {
 </script>
 
 <template>
-    <form @submit.prevent="saveApp">
+    <form data-testid="createAppDialogForm" @submit.prevent="saveApp">
         <div class="flex flex-col gap-3">
             <div class="flex flex-col gap-2">
                 <label>Organization</label>
                 <Select name="org" v-model="selectedOrg" :options="orgs" optionLabel="displayName"
                     :disabled="disableOrg" placeholder="Select organization">
                     <template #footer>
                         <div class="px-2 pb-2">
-                            <Button label="Add New" fluid severity="secondary" text size="small" icon="pi pi-plus"
-                                @click="() => addOrgVisible = true" />
+                            <Button data-testid="addNewOrgbtn" label="Add New" fluid severity="secondary" text
+                                size="small" icon="pi pi-plus" @click="() => addOrgVisible = true" />
                         </div>
                     </template>
                 </Select>
@@ -71,7 +71,7 @@ const {
             </div>
             <div class="flex flex-col gap-2">
                 <label>App Name</label>
-                <InputText v-model="appName"></InputText>
+                <InputText data-testid="inputAppName" v-model="appName"></InputText>
             </div>
             <Button label="Save" class="mt-3" :loading="isPending" type="submit" />
         </div>
@@ -81,7 +81,7 @@ const {
         <form @submit.prevent="saveOrg">
             <div class="flex flex-col gap-3 w-25rem">
                 <InputText data-testid="orgname" name="name" v-model="orgNameRef"></InputText>
-                <Button label="Save" type="submit" :loading="isPendingOrg"></Button>
+                <Button data-testid="orgsavebtn" label="Save" type="submit" :loading="isPendingOrg"></Button>
             </div>
         </form>
     </Dialog>

tests-e2e/apps.test.mts

@@ -0,0 +1,34 @@
+import { expect, test } from '@nuxt/test-utils/playwright'
+import { uuidv4 } from 'uuidv7'
+
+test('Apps test', async ({ page, goto, context }) => {
+    const orgName = `Org Test ${uuidv4().slice(0, 8)}`
+
+    await test.step('User can create organization', async () => {
+        await goto('/apps')
+        await page.getByText('Add app').click()
+        await page.getByText('Select organization').click()
+        await page.getByTestId('addNewOrgbtn').click()
+        await page.getByTestId('orgname').fill(orgName)
+        await page.getByTestId('orgsavebtn').click()
+        await page.getByText('Select organization').click()
+        await expect(page.getByText(orgName)).toHaveCount(2)
+    })
+
+    const osTestTypes = ['Android', 'iOS']
+    for (const osTestType of osTestTypes) {
+        const appName = `Habit Tool - ${osTestType}`
+        await test.step(`User can create new app ${osTestType} from newly created org`, async () => {
+            await page.getByText('Select organization').click()
+            await page.getByLabel(orgName).getByText(orgName).click()
+            await page.getByText('Select OS Type').click()
+            await page.getByLabel(osTestType).click()
+            await page.getByTestId('inputAppName').fill(appName)
+            await page.getByText('Save').click()
+            await expect(page.getByText(appName)).toHaveCount(1)
+            await expect(page.getByTestId('createAppDialogForm')).toBeHidden()
+            await page.getByText('Add app').click()
+        })
+    }
+    await page.keyboard.press('Escape')
+})