test(picker-internal): re-enable basic screenshot test (#27768)
Issue number: N/A --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the current behavior? <!-- Please describe the current behavior that you are modifying. --> Test was skipped due to flakiness ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Re-enabled test - Removes directions tests because behavior does not vary across text directions - Updated screenshot to screenshot individual picker instead of the entire page ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change, please describe the impact and migration path for existing applications below. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> --------- Co-authored-by: ionitron <hi@ionicframework.com>
@ -53,7 +53,7 @@
|
||||
<div class="grid">
|
||||
<div class="grid-item">
|
||||
<h2>Inline</h2>
|
||||
<ion-picker-internal>
|
||||
<ion-picker-internal id="inline">
|
||||
<ion-picker-column-internal id="first"></ion-picker-column-internal>
|
||||
<ion-picker-column-internal id="second"></ion-picker-column-internal>
|
||||
</ion-picker-internal>
|
||||
|
@ -1,25 +1,18 @@
|
||||
import { expect } from '@playwright/test';
|
||||
import { configs, test } from '@utils/test/playwright';
|
||||
|
||||
// TODO: FW-3020
|
||||
configs().forEach(({ title, screenshot, config }) => {
|
||||
test.describe(title('picker-internal: rendering'), () => {
|
||||
test.skip('inline pickers should not have visual regression', async ({ page }) => {
|
||||
await page.goto(`/src/components/picker-internal/test/basic`, config);
|
||||
|
||||
await page.setIonViewport();
|
||||
|
||||
await expect(page).toHaveScreenshot(screenshot(`picker-internal-inline-diff`), {
|
||||
fullPage: true,
|
||||
});
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
/**
|
||||
* This behavior does not vary across modes.
|
||||
* This behavior does not vary across directions.
|
||||
*/
|
||||
configs({ directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
|
||||
test.describe(title('picker-internal: rendering'), () => {
|
||||
test('inline pickers should not have visual regression', async ({ page }) => {
|
||||
await page.goto(`/src/components/picker-internal/test/basic`, config);
|
||||
|
||||
await expect(page.locator('#inline')).toHaveScreenshot(screenshot(`picker-internal-inline-diff`));
|
||||
});
|
||||
});
|
||||
|
||||
test.describe(title('picker-internal: overlay rendering'), () => {
|
||||
test('popover: should not have visual regression', async ({ page }) => {
|
||||
await page.goto(`/src/components/picker-internal/test/basic`, config);
|
||||
|
Before Width: | Height: | Size: 132 KiB After Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 54 KiB After Width: | Height: | Size: 15 KiB |
Before Width: | Height: | Size: 130 KiB After Width: | Height: | Size: 12 KiB |
Before Width: | Height: | Size: 132 KiB |
Before Width: | Height: | Size: 54 KiB |
Before Width: | Height: | Size: 130 KiB |
Before Width: | Height: | Size: 153 KiB After Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 60 KiB After Width: | Height: | Size: 18 KiB |
Before Width: | Height: | Size: 147 KiB After Width: | Height: | Size: 14 KiB |
Before Width: | Height: | Size: 154 KiB |
Before Width: | Height: | Size: 60 KiB |
Before Width: | Height: | Size: 147 KiB |