Skip to content

Commit e3e0289

Browse files
OS-susmitabhowmikOS-susmitabhowmik
committed
chore(): fix build and lint
1 parent 6da02c3 commit e3e0289

4 files changed

Lines changed: 52 additions & 52 deletions

File tree

‎core/src/components.d.ts‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -4060,7 +4060,7 @@ export namespace Components {
40604060
*/
40614061
"mode"?: "ios" | "md";
40624062
/**
4063-
* Describes the scroll effect that will be applied to the tab bar. `"hide"` slides the tab bar out of view when scrolling down and back in when scrolling up.
4063+
* Describes the scroll effect that will be applied to the tab bar. `"hide"` slides the tab bar out of view when scrolling down and back in when scrolling up. Note: `"hide"` is ignored when the tab bar is nested inside an `ion-footer` to avoid leaving an empty footer visible on screen. Set `scroll-effect="hide"` on the footer instead so the entire footer hides together.
40644064
*/
40654065
"scrollEffect"?: TabBarScrollEffect;
40664066
/**
@@ -10238,7 +10238,7 @@ declare namespace LocalJSX {
1023810238
"onIonTabBarChanged"?: (event: IonTabBarCustomEvent<TabBarChangedEventDetail>) => void;
1023910239
"onIonTabBarLoaded"?: (event: IonTabBarCustomEvent<void>) => void;
1024010240
/**
10241-
* Describes the scroll effect that will be applied to the tab bar. `"hide"` slides the tab bar out of view when scrolling down and back in when scrolling up.
10241+
* Describes the scroll effect that will be applied to the tab bar. `"hide"` slides the tab bar out of view when scrolling down and back in when scrolling up. Note: `"hide"` is ignored when the tab bar is nested inside an `ion-footer` to avoid leaving an empty footer visible on screen. Set `scroll-effect="hide"` on the footer instead so the entire footer hides together.
1024210242
*/
1024310243
"scrollEffect"?: TabBarScrollEffect;
1024410244
/**

‎core/src/components/header/header.ios.scss‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,4 +39,3 @@
3939
.header-collapse-condense ion-toolbar:last-of-type {
4040
--border-width: 0px;
4141
}
42-

‎core/src/components/header/header.md.scss‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,6 @@
2525
box-shadow: none;
2626
}
2727

28-
2928
/**
3029
* The fade effect fades the toolbar background via --opacity-scale,
3130
* but box-shadow is not affected by that variable. Remove it so

‎core/src/components/header/test/scroll-effect-condense/header.e2e.ts‎

Lines changed: 50 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -1,69 +1,71 @@
11
import { expect } from '@playwright/test';
22
import { configs, test } from '@utils/test/playwright';
33

4-
configs({ modes: ['ios', 'md', 'ionic-ios', 'ionic-md'], directions: ['ltr'] }).forEach(({ title, screenshot, config }) => {
5-
test.describe(title('header: scroll-effect-condense'), () => {
6-
test('should have the condense class on the large title header', async ({ page }) => {
7-
await page.goto('/src/components/header/test/scroll-effect-condense', config);
4+
configs({ modes: ['ios', 'md', 'ionic-ios', 'ionic-md'], directions: ['ltr'] }).forEach(
5+
({ title, screenshot, config }) => {
6+
test.describe(title('header: scroll-effect-condense'), () => {
7+
test('should have the condense class on the large title header', async ({ page }) => {
8+
await page.goto('/src/components/header/test/scroll-effect-condense', config);
9+
10+
const largeTitleHeader = page.locator('#largeTitleHeader');
11+
await expect(largeTitleHeader).toHaveClass(/header-collapse-condense/);
12+
});
813

9-
const largeTitleHeader = page.locator('#largeTitleHeader');
10-
await expect(largeTitleHeader).toHaveClass(/header-collapse-condense/);
11-
});
14+
test('should not have visual regressions with large title visible', async ({ page }) => {
15+
await page.goto('/src/components/header/test/scroll-effect-condense', config);
1216

13-
test('should not have visual regressions with large title visible', async ({ page }) => {
14-
await page.goto('/src/components/header/test/scroll-effect-condense', config);
17+
const largeTitleHeader = page.locator('#largeTitleHeader');
18+
await expect(largeTitleHeader).toHaveScreenshot(screenshot(`header-condense-large-title-initial-diff`));
19+
});
1520

16-
const largeTitleHeader = page.locator('#largeTitleHeader');
17-
await expect(largeTitleHeader).toHaveScreenshot(screenshot(`header-condense-large-title-initial-diff`));
18-
});
21+
test('should not have visual regressions with large title collapsed', async ({ page }) => {
22+
await page.goto('/src/components/header/test/scroll-effect-condense', config);
1923

20-
test('should not have visual regressions with large title collapsed', async ({ page }) => {
21-
await page.goto('/src/components/header/test/scroll-effect-condense', config);
24+
const smallTitleHeader = page.locator('#smallTitleHeader');
25+
const content = page.locator('ion-content');
2226

23-
const smallTitleHeader = page.locator('#smallTitleHeader');
24-
const content = page.locator('ion-content');
27+
await content.evaluate(async (el: HTMLIonContentElement) => {
28+
await el.scrollToBottom();
29+
});
30+
await page.locator('#largeTitleHeader.header-collapse-condense-inactive').waitFor();
2531

26-
await content.evaluate(async (el: HTMLIonContentElement) => {
27-
await el.scrollToBottom();
32+
await expect(smallTitleHeader).toHaveScreenshot(screenshot(`header-condense-large-title-collapsed-diff`));
2833
});
29-
await page.locator('#largeTitleHeader.header-collapse-condense-inactive').waitFor();
3034

31-
await expect(smallTitleHeader).toHaveScreenshot(screenshot(`header-condense-large-title-collapsed-diff`));
32-
});
35+
test('should hide small title from screen readers when collapsed', async ({ page }) => {
36+
await page.goto('/src/components/header/test/scroll-effect-condense', config);
37+
const smallTitleHeader = page.locator('#smallTitleHeader');
38+
const smallTitle = smallTitleHeader.locator('ion-title');
39+
const content = page.locator('ion-content');
3340

34-
test('should hide small title from screen readers when collapsed', async ({ page }) => {
35-
await page.goto('/src/components/header/test/scroll-effect-condense', config);
36-
const smallTitleHeader = page.locator('#smallTitleHeader');
37-
const smallTitle = smallTitleHeader.locator('ion-title');
38-
const content = page.locator('ion-content');
41+
await expect(smallTitle).toHaveAttribute('aria-hidden', 'true');
3942

40-
await expect(smallTitle).toHaveAttribute('aria-hidden', 'true');
43+
await content.evaluate(async (el: HTMLIonContentElement) => {
44+
await el.scrollToBottom();
45+
});
46+
await page.locator('#largeTitleHeader.header-collapse-condense-inactive').waitFor();
4147

42-
await content.evaluate(async (el: HTMLIonContentElement) => {
43-
await el.scrollToBottom();
48+
const ariaHidden = await smallTitle.getAttribute('aria-hidden');
49+
expect(ariaHidden).toBeNull();
4450
});
45-
await page.locator('#largeTitleHeader.header-collapse-condense-inactive').waitFor();
4651

47-
const ariaHidden = await smallTitle.getAttribute('aria-hidden');
48-
expect(ariaHidden).toBeNull();
49-
});
52+
test('should only have the banner role on the active header', async ({ page }) => {
53+
await page.goto('/src/components/header/test/scroll-effect-condense', config);
54+
const largeTitleHeader = page.locator('#largeTitleHeader');
55+
const smallTitleHeader = page.locator('#smallTitleHeader');
56+
const content = page.locator('ion-content');
5057

51-
test('should only have the banner role on the active header', async ({ page }) => {
52-
await page.goto('/src/components/header/test/scroll-effect-condense', config);
53-
const largeTitleHeader = page.locator('#largeTitleHeader');
54-
const smallTitleHeader = page.locator('#smallTitleHeader');
55-
const content = page.locator('ion-content');
58+
await expect(largeTitleHeader).toHaveAttribute('role', 'banner');
59+
await expect(smallTitleHeader).toHaveAttribute('role', 'none');
5660

57-
await expect(largeTitleHeader).toHaveAttribute('role', 'banner');
58-
await expect(smallTitleHeader).toHaveAttribute('role', 'none');
61+
await content.evaluate(async (el: HTMLIonContentElement) => {
62+
await el.scrollToBottom();
63+
});
64+
await page.locator('#largeTitleHeader.header-collapse-condense-inactive').waitFor();
5965

60-
await content.evaluate(async (el: HTMLIonContentElement) => {
61-
await el.scrollToBottom();
66+
await expect(largeTitleHeader).toHaveAttribute('role', 'none');
67+
await expect(smallTitleHeader).toHaveAttribute('role', 'banner');
6268
});
63-
await page.locator('#largeTitleHeader.header-collapse-condense-inactive').waitFor();
64-
65-
await expect(largeTitleHeader).toHaveAttribute('role', 'none');
66-
await expect(smallTitleHeader).toHaveAttribute('role', 'banner');
6769
});
68-
});
69-
});
70+
}
71+
);

0 commit comments

Comments
 (0)