-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* [ch-dialog] Rename `hidden` prop to `show` * [ch-dialog] Update readme * [ch-dialog] Include base tests Include the following base tests files: - basic - parts - slots * [ch-dialog] Include behavior tests files add the following tests files: - drag - modal - position * [ch-dialog] Update `getDialogPartRect` helper function Improve error log * [ch-dialog] Include "resize" behavior test (WIP) * [ch-dialog] Remove tests Tests will be added on another PR * [ch-popover] Update `hidden` prop name, in favor of `show` Update property and showcase file accordingly * [ch-tooltip] Update `ch-popover` `hidden` property name * [ch-combo-box] Update `ch-popover` `hidden` property name * [ch-dropdown] Update `ch-popover` `hidden` property name * Update readme.md * [combo-box] Apply PR review suggestions * `[ch-dialog]` Apply PR review suggestions * `[ch-popover]` Apply PR review suggestions * `[ch-tooltip]` Apply PR review suggestions * `[ch-dialog]` Include some semantic validation * `[ch-dialog]` improve `#setBorderSizeWatcher` call on `componentWillRender` - Add a `setTimeout` in order to force execution after browser paint. This fixes some E2E tests random fails, due to `this.#resizeLayer` being `undefined`. * `[ch-dialog]`Rename tests filename * `[ch-dialog]` Apply PR review suggestions * `[ch-dialog]` Split `contstraints.e2e.ts` into two files * `[ch-dialog]` Fix failing test on `[basic]` For the button to be rendered, `showHeader` property should be `true` * `[ch-dialog][ch-popover]` Apply PR review suggestions * `[ch-dialog]` Force push * `[ch-dialog]` assert parts not null on `[basic]` test * `[ch-dialog]` Comment `testDefaultProperty` to debug Some tests are failing on `basic.e2e.ts` only on the server. Check what happens if `testDefaultProperty` is not run. * `[ch-dialog]` Comment `testDefaultProperty` function to debug * `[ch-dialog]` Include `await` on tests that were failing * `[ch-dialog]` Rename `chDialogRef` in favor of `dialogRef` * `[ch-dialog]` Set property `show` to true on some tests Although they are not required at the time of writting, setting this property to true ensures future compatibility, in the case the parts involved on these tests are dependent on the `show` property to be rendered. * `[ch-dialog]` Remove unrequired `not.toBeNull()` These types of checks should be asserted on another test suite rather.
- Loading branch information
Showing
13 changed files
with
214 additions
and
71 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,41 @@ | ||
| import { E2EElement, E2EPage, newE2EPage } from "@stencil/core/testing"; | ||
|
|
||
| describe("[ch-dialog][accessibility]", () => { | ||
| let page: E2EPage; | ||
| let dialogRef: E2EElement; | ||
|
|
||
| beforeEach(async () => { | ||
| page = await newE2EPage({ | ||
| html: `<ch-dialog></ch-dialog>`, | ||
| failOnConsoleError: true | ||
| }); | ||
|
|
||
| dialogRef = await page.find("ch-dialog"); | ||
|
|
||
| // Set Properties | ||
| dialogRef.setProperty("showHeader", true); | ||
| dialogRef.setProperty("showFooter", true); | ||
| dialogRef.setProperty("show", true); | ||
| await page.waitForChanges(); | ||
| }); | ||
|
|
||
| it("should not render a header element", async () => { | ||
| const headerEl = await page.find("ch-dialog >>> header"); | ||
| expect(headerEl).toBeFalsy(); | ||
| }); | ||
|
|
||
| it("should not render a footer element", async () => { | ||
| const footerEl = await page.find("ch-dialog >>> footer"); | ||
| expect(footerEl).toBeFalsy(); | ||
| }); | ||
|
|
||
| it("should not include a role attribute on the part='header' element", async () => { | ||
| const headerPartRef = await page.find("ch-dialog >>> [part='header']"); | ||
| expect(headerPartRef).not.toHaveAttribute("role"); | ||
| }); | ||
|
|
||
| it("should not include a role attribute on the part='footer' element", async () => { | ||
| const footerPartRef = await page.find("ch-dialog >>> [part='footer']"); | ||
| expect(footerPartRef).not.toHaveAttribute("role"); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,99 @@ | ||
| import { E2EElement, E2EPage, newE2EPage } from "@stencil/core/testing"; | ||
|
|
||
| describe("[ch-dialog][basic]", () => { | ||
| let page: E2EPage; | ||
| let dialogRef: E2EElement; | ||
|
|
||
| const testDefaultProperty = async ( | ||
| propertyName: string, | ||
| expectedValue: any | ||
| ) => { | ||
| it(`the "${propertyName}" property should be ${ | ||
| expectedValue === undefined ? "undefined" : `"${expectedValue}"` | ||
| }`, async () => { | ||
| const propertyValue = await dialogRef.getProperty(propertyName); | ||
| if (expectedValue === undefined) { | ||
| expect(propertyValue).toBeUndefined(); | ||
| } else { | ||
| expect(propertyValue).toBe(expectedValue); | ||
| } | ||
| }); | ||
| }; | ||
|
|
||
| beforeEach(async () => { | ||
| page = await newE2EPage({ | ||
| html: `<ch-dialog></ch-dialog>`, | ||
| failOnConsoleError: true | ||
| }); | ||
|
|
||
| dialogRef = await page.find("ch-dialog"); | ||
| }); | ||
|
|
||
| // Validate shadowRoot | ||
|
|
||
| it("should have a shadowRoot", async () => { | ||
| expect(dialogRef.shadowRoot).toBeTruthy(); | ||
| }); | ||
|
|
||
| // Validate properties default values | ||
|
|
||
| testDefaultProperty("adjustPositionAfterResize", false); | ||
|
|
||
| testDefaultProperty("allowDrag", "no"); | ||
|
|
||
| testDefaultProperty("caption", undefined); | ||
|
|
||
| testDefaultProperty("closeButtonAccessibleName", undefined); | ||
|
|
||
| testDefaultProperty("show", false); | ||
|
|
||
| testDefaultProperty("modal", true); | ||
|
|
||
| testDefaultProperty("resizable", false); | ||
|
|
||
| testDefaultProperty("showFooter", false); | ||
|
|
||
| testDefaultProperty("showHeader", false); | ||
|
|
||
| // Validate id's | ||
|
|
||
| it("should not include an id on any of the resize-bar elements", async () => { | ||
| dialogRef.setProperty("resizable", true); | ||
| dialogRef.setProperty("show", true); | ||
| await page.waitForChanges(); | ||
|
|
||
| const partsNames = [ | ||
| "edge edge-block-start", | ||
| "edge edge-inline-end", | ||
| "edge edge-block-end", | ||
| "edge edge-inline-start", | ||
| "corner corner-block-start-inline-start", | ||
| "corner corner-block-start-inline-end", | ||
| "corner corner-block-end-inline-start", | ||
| "corner corner-block-end-inline-end" | ||
| ]; | ||
|
|
||
| for (const part of partsNames) { | ||
| const resizePartRef = await page.find(`ch-dialog >>> [part="${part}"]`); | ||
| expect(resizePartRef).not.toHaveAttribute("id"); | ||
| } | ||
| }); | ||
|
|
||
| it("should not include an id on the part='content' element", async () => { | ||
| dialogRef.setProperty("show", true); | ||
| await page.waitForChanges(); | ||
| const contentPartRef = await page.find("ch-dialog >>> [part='content']"); | ||
| expect(contentPartRef).not.toHaveAttribute("id"); | ||
| }); | ||
|
|
||
| it("should not include an id on the part='close-button' element", async () => { | ||
| dialogRef.setProperty("showHeader", true); | ||
| dialogRef.setProperty("show", true); | ||
| await page.waitForChanges(); | ||
|
|
||
| const closeButtonPartRef = await page.find( | ||
| "ch-dialog >>> [part='close-button']" | ||
| ); | ||
| expect(closeButtonPartRef).not.toHaveAttribute("id"); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Oops, something went wrong.