|
| 1 | +const { test, expect } = require('@playwright/test'); |
| 2 | +const config = require('../../../config'); |
| 3 | +const common = require('../../../common'); |
| 4 | + |
| 5 | +const isDisabled = true; |
| 6 | +const isVisible = true; |
| 7 | + |
| 8 | +test.beforeEach(common.launchPortal); |
| 9 | + |
| 10 | +test.describe('E2E test for Location component', () => { |
| 11 | + let attributes; |
| 12 | + |
| 13 | + test('should login, create case and run Location tests', async ({ page }) => { |
| 14 | + await common.login(config.config.apps.digv2.user.username, config.config.apps.digv2.user.password, page); |
| 15 | + |
| 16 | + /** Verify homepage */ |
| 17 | + const announcementBanner = page.locator('h6:has-text("Announcements")'); |
| 18 | + await expect(announcementBanner).toBeVisible(); |
| 19 | + |
| 20 | + const worklist = page.locator('h6:has-text("My Worklist")'); |
| 21 | + await expect(worklist).toBeVisible(); |
| 22 | + |
| 23 | + /** Create case */ |
| 24 | + const complexFieldsCase = page.locator('div[role="button"]:has-text("Form Field")'); |
| 25 | + await complexFieldsCase.click(); |
| 26 | + |
| 27 | + /** Select Location category */ |
| 28 | + const selectedCategory = page.locator('div[data-test-id="76729937a5eb6b0fd88c42581161facd"]'); |
| 29 | + await selectedCategory.click(); |
| 30 | + await page.locator('li >> text="Location"').click(); |
| 31 | + |
| 32 | + /** Select Required subcategory */ |
| 33 | + const selectedSubCategory = page.locator('div[data-test-id="9463d5f18a8924b3200b56efaad63bda"]'); |
| 34 | + await selectedSubCategory.click(); |
| 35 | + await page.getByRole('option', { name: 'Required' }).click(); |
| 36 | + |
| 37 | + await page.locator('button:has-text("submit")').click(); |
| 38 | + |
| 39 | + await expect(page.locator('div[role="alert"] >> text="Cannot be blank"')).toBeVisible(); |
| 40 | + /** Required field test */ |
| 41 | + const requiredLocationField = page.locator('input[data-test-id="5d234240d150ee2ad896ca0be0e01fd3"]'); |
| 42 | + await requiredLocationField.type('Hitech City, Hyderabad'); |
| 43 | + await page.waitForSelector('.pac-container .pac-item', { timeout: 50000 }); |
| 44 | + await page.locator('.pac-container .pac-item').nth(1).click(); |
| 45 | + |
| 46 | + await expect(requiredLocationField).not.toHaveValue(''); |
| 47 | + await expect(page.locator('p.Mui-error.Mui-required')).toBeHidden(); |
| 48 | + |
| 49 | + attributes = await common.getAttributes(requiredLocationField); |
| 50 | + expect(attributes.includes('required')).toBeTruthy(); |
| 51 | + |
| 52 | + /** Non-required field */ |
| 53 | + const nonRequiredLocationField = page.locator('input[data-test-id="e4c3274b192b2696223fe7c86c635b75"]'); |
| 54 | + attributes = await common.getAttributes(nonRequiredLocationField); |
| 55 | + expect(attributes.includes('required')).toBeFalsy(); |
| 56 | + |
| 57 | + /** Disable tests */ |
| 58 | + await selectedSubCategory.click(); |
| 59 | + await page.getByRole('option', { name: 'Disable' }).click(); |
| 60 | + |
| 61 | + const alwaysDisabledLocation = page.locator('input[data-test-id="43067a18c1d1c66f64f01e7e274c6396"]'); |
| 62 | + attributes = await common.getAttributes(alwaysDisabledLocation); |
| 63 | + expect(attributes.includes('disabled')).toBeTruthy(); |
| 64 | + |
| 65 | + const conditionallyDisabledLocation = page.locator('input[data-test-id="878f51dda2d3d8279c962e2f65172ac3"]'); |
| 66 | + attributes = await common.getAttributes(conditionallyDisabledLocation); |
| 67 | + if (isDisabled) { |
| 68 | + expect(attributes.includes('disabled')).toBeTruthy(); |
| 69 | + } else { |
| 70 | + expect(attributes.includes('disabled')).toBeFalsy(); |
| 71 | + } |
| 72 | + |
| 73 | + const neverDisabledLocation = page.locator('input[data-test-id="a98054547fce446cbe5d4f9fb06c922c"]'); |
| 74 | + attributes = await common.getAttributes(neverDisabledLocation); |
| 75 | + expect(attributes.includes('disabled')).toBeFalsy(); |
| 76 | + |
| 77 | + /** Update tests */ |
| 78 | + await selectedSubCategory.click(); |
| 79 | + await page.getByRole('option', { name: 'Update' }).click(); |
| 80 | + |
| 81 | + const editableLocation = page.locator('input[data-test-id="666e146bbb2d7e31be1a66c4ea52f453"]'); |
| 82 | + await editableLocation.fill('Hitech City, Hyderabad'); |
| 83 | + |
| 84 | + await page.waitForSelector('.pac-container .pac-item', { timeout: 5000 }); |
| 85 | + |
| 86 | + await page.locator('.pac-container .pac-item').nth(1).click(); |
| 87 | + |
| 88 | + attributes = await common.getAttributes(editableLocation); |
| 89 | + expect(attributes.includes('readonly')).toBeFalsy(); |
| 90 | + |
| 91 | + /** Visibility tests */ |
| 92 | + await selectedSubCategory.click(); |
| 93 | + |
| 94 | + await page.locator('[data-value="Visibility"]').click(); |
| 95 | + |
| 96 | + await expect(page.locator('input[data-test-id="4d056e06ff67ee10b252d5d96d373c91"]')).toBeVisible(); |
| 97 | + |
| 98 | + const neverVisibleLocation = page.locator('input[data-test-id="804db68b1b68c6e908079a1cab23fcdc"]'); |
| 99 | + await expect(neverVisibleLocation).not.toBeVisible(); |
| 100 | + |
| 101 | + const conditionallyVisibleLocation = page.locator('input[data-test-id="4b7ffe4018eb786ba3d11aa195f7d98d"]'); |
| 102 | + if (isVisible) { |
| 103 | + await expect(conditionallyVisibleLocation).toBeVisible(); |
| 104 | + } else { |
| 105 | + await expect(conditionallyVisibleLocation).not.toBeVisible(); |
| 106 | + } |
| 107 | + |
| 108 | + /** Label and Placeholder tests */ |
| 109 | + await selectedSubCategory.click(); |
| 110 | + await page.getByRole('option', { name: 'Label' }).click(); |
| 111 | + |
| 112 | + const defaultLabelLocationField = page.locator('input[data-test-id="1d1f18e5499018ff649dd30066ba2270"]'); |
| 113 | + const defaultLabel = await defaultLabelLocationField.locator('xpath=ancestor::div[contains(@class, "MuiFormControl")]//label').textContent(); |
| 114 | + expect(defaultLabel).toBe('LocationDefaultLabel'); |
| 115 | + |
| 116 | + const customLabelLocationField = page.locator('input[data-test-id="88de9f842705651ff0dae0556755a43e"]'); |
| 117 | + const customLabel = await customLabelLocationField.locator('xpath=ancestor::div[contains(@class, "MuiFormControl")]//label').textContent(); |
| 118 | + expect(customLabel).toBe('Enter location (custom label)'); |
| 119 | + |
| 120 | + const customPlaceholderHelperField = page.locator('input[data-test-id="df7f2d2aa61b4ebfddb604ae39cb7374"]'); |
| 121 | + const placeholder = await customPlaceholderHelperField.getAttribute('placeholder'); |
| 122 | + expect(placeholder).toBe('Enter location'); |
| 123 | + const helper = await customPlaceholderHelperField |
| 124 | + .locator('xpath=ancestor::div[contains(@class, "MuiFormControl")]//p[contains(@class, "MuiFormHelperText")]') |
| 125 | + .textContent(); |
| 126 | + expect(helper).toBe('You can either enter place name or coordinates '); |
| 127 | + |
| 128 | + /** Map visibility tests */ |
| 129 | + |
| 130 | + await selectedSubCategory.click(); |
| 131 | + await page.getByRole('option', { name: 'Map Visibility' }).click(); |
| 132 | + |
| 133 | + const mapVisibleField = page.locator('input[data-test-id="ce5f551ab012660f2358544a1ce8dede"]'); |
| 134 | + await expect(mapVisibleField).toBeVisible(); |
| 135 | + const mapContainer = page.locator('input[data-test-id="ce5f551ab012660f2358544a1ce8dede"] >> xpath=..'); |
| 136 | + await expect(mapContainer.locator('div')).toHaveCount(1); // Google Map |
| 137 | + const hiddenMapContainer = page.locator('input[data-test-id="ad80fd801feb0799ca829d6eedb8902a"] >> xpath=..'); |
| 138 | + await expect(hiddenMapContainer.locator('iframe')).toHaveCount(0); |
| 139 | + |
| 140 | + /** Coordinates format test */ |
| 141 | + const onlyCoordsField = page.locator('input[data-test-id="41b59bdbb86495ae2db766c2944d4d7b"]'); |
| 142 | + await onlyCoordsField.fill('Hitech City, Hyderabad'); |
| 143 | + await page.waitForSelector('.pac-container .pac-item', { timeout: 5000 }); |
| 144 | + await page.locator('.pac-container .pac-item').nth(1).click(); |
| 145 | + |
| 146 | + const coordinates = await onlyCoordsField.inputValue(); |
| 147 | + const regex = /^-?\d+(\.\d+)?\s*,\s*-?\d+(\.\d+)?$/; |
| 148 | + expect(regex.test(coordinates.trim())).toBe(true); |
| 149 | + }, 10000); |
| 150 | +}); |
| 151 | + |
| 152 | +test.afterEach(async ({ page }) => { |
| 153 | + await page.close(); |
| 154 | +}); |
0 commit comments