Skip to content

Commit 5e5aae7

Browse files
thejackshelton-kunaicothejackshelton-kunaico
authored
changeset (#316)
* changeset * test: add more assetions to failing ci test * ai ci * more ai ci * updated ci * correct package and esm * feat: check attribute exists * pls work * fix: flaky tests * feat: try polling to vitest config * fix: remove polling * feat: toHaveAttribute
1 parent 2e73f6c commit 5e5aae7

File tree

7 files changed

+128
-34
lines changed

7 files changed

+128
-34
lines changed

‎.changeset/smart-grapes-report.md‎

Lines changed: 57 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,57 @@
1+
---
2+
"@qds.dev/ui": patch
3+
"@qds.dev/tools": patch
4+
"@qds.dev/utils": patch
5+
---
6+
7+
### Major Changes
8+
9+
- **Scoped Styles System** (#307): Complete rewrite of the styling system with significant architectural improvements
10+
- Implemented v2 scoped styles architecture
11+
- Simplified checkbox root attributes
12+
- Correct backpatch handling for reactive updates
13+
- Proper SSR unmount behavior
14+
- Managed ARIA IDs for accessibility
15+
- Isomorphic DOM nodes for better SSR/CSR consistency
16+
- Global observer for SSR unmount optimization
17+
- Transform function for library builds
18+
- QRL injection with unit tests
19+
- Improved value binding system that ignores adding attributes in the DOM
20+
- Better DX ergonomics for edge cases
21+
22+
### Minor Changes
23+
24+
- **Vitest 4 Upgrade** (#310): Migrated to Vitest 4 with improved testing infrastructure
25+
- Updated test runners across multiple components
26+
- Partial conversion to new vitest system (#293)
27+
- Updated QR Code tests (#292)
28+
- Updated Progress tests (#291)
29+
- Updated Scroll Area tests (#295)
30+
- Updated Slider tests (#296)
31+
- Updated Switch tests (#300)
32+
- Updated Tabs tests (#301)
33+
- Updated Toggle tests (#302)
34+
- Added pagination tests (#288)
35+
- Added Label and Menu tests (#286)
36+
- Fixed last tests + nesting scopes (#314)
37+
- SSR tests working (#315)
38+
39+
- **Modal & Collapsible Enhancements** (#312):
40+
- Added data attributes to Modal component
41+
- Changed scope naming convention
42+
- Added data attributes to Collapsible component
43+
44+
- **Field Component Data Attributes** (#309): Added proper data attributes to Field component for better styling and state management
45+
46+
- **Icon Improvements** (#311): Icons now respect `1em` as the default size, improving typography integration
47+
48+
### Patch Changes
49+
50+
- **Checkbox Layout Fix** (#313): Fixed layout issues in checkbox component
51+
- **Slider Update** (#308): V2 slider improvements and updates
52+
- **Dependencies Update** (#305): Updated package dependencies and pnpm lockfile
53+
- **Documentation**:
54+
- Removed broken SVG in README
55+
- Updated index.mdx (#299)
56+
- **Testing**:
57+
- Added additional tests (#303)

‎.github/workflows/ci.yml‎

Lines changed: 24 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -43,28 +43,44 @@ jobs:
4343
key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
4444
restore-keys: |
4545
${{ runner.os }}-pnpm-store-
46-
46+
4747
- name: ✨ Install dependencies
48-
run: pnpm install
48+
run: pnpm install --frozen-lockfile --prefer-offline
49+
50+
- name: 🔍 Get Playwright version
51+
id: playwright-version
52+
run: |
53+
VERSION=$(jq -r '.devDependencies.playwright' package.json | tr -d '^~')
54+
echo "version=$VERSION" >> $GITHUB_OUTPUT
4955
5056
- name: 💾 Cache Playwright browsers
5157
uses: actions/cache@v4
5258
id: playwright-cache
5359
with:
5460
path: ~/.cache/ms-playwright
55-
key: ${{ runner.os }}-playwright-${{ hashFiles('**/pnpm-lock.yaml') }}
61+
key: ${{ runner.os }}-playwright-${{ steps.playwright-version.outputs.version }}-chromium
5662
restore-keys: |
5763
${{ runner.os }}-playwright-
5864
5965
- name: 🎭 Install Playwright browsers
6066
if: steps.playwright-cache.outputs.cache-hit != 'true'
61-
run: pnpm exec playwright install --with-deps chromium
62-
63-
- name: 🎭 Install Playwright system dependencies
64-
if: steps.playwright-cache.outputs.cache-hit == 'true'
65-
run: pnpm exec playwright install-deps chromium
67+
run: pnpm exec playwright install chromium --with-deps
68+
69+
- name: 💾 Cache build outputs
70+
uses: actions/cache@v4
71+
id: build-cache
72+
with:
73+
path: |
74+
libs/tools/dist
75+
libs/utils/lib
76+
libs/utils/lib-types
77+
**/tsconfig.tsbuildinfo
78+
key: ${{ runner.os }}-build-${{ hashFiles('libs/tools/**', 'libs/utils/**', '!**/node_modules/**') }}
79+
restore-keys: |
80+
${{ runner.os }}-build-
6681
6782
- name: 🔨 Build underlying tools and utilities
83+
if: steps.build-cache.outputs.cache-hit != 'true'
6884
run: |
6985
pnpm --filter ./libs/tools build
7086
pnpm --filter ./libs/utils build

‎libs/components/src/checkbox/checkbox.browser.tsx‎

Lines changed: 12 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -547,12 +547,15 @@ test("description is linked to trigger via aria-describedby", async () => {
547547
await expect.element(Trigger).toBeVisible();
548548
await expect.element(Description).toBeVisible();
549549

550+
await expect.element(Description).toHaveAttribute("id");
551+
await expect.element(Trigger).toHaveAttribute("aria-describedby");
552+
553+
// Now safely get the values
550554
const triggerElement = await Trigger.element();
551555
const descriptionElement = await Description.element();
552556
const descriptionId = descriptionElement?.getAttribute("id");
553557
const describedBy = triggerElement?.getAttribute("aria-describedby");
554558

555-
expect(descriptionId).toBeTruthy();
556559
expect(describedBy).toContain(descriptionId as string);
557560
});
558561

@@ -576,12 +579,15 @@ test("error message is linked to trigger via aria-describedby", async () => {
576579
await expect.element(Trigger).toBeVisible();
577580
await expect.element(CheckboxError).toBeVisible();
578581

582+
await expect.element(CheckboxError).toHaveAttribute("id");
583+
await expect.element(Trigger).toHaveAttribute("aria-describedby");
584+
585+
// Now safely get the values
579586
const triggerElement = await Trigger.element();
580587
const errorElement = await CheckboxError.element();
581588
const errorId = errorElement?.getAttribute("id");
582589
const describedBy = triggerElement?.getAttribute("aria-describedby");
583590

584-
expect(errorId).toBeTruthy();
585591
expect(describedBy).toContain(errorId as string);
586592
});
587593

@@ -622,15 +628,17 @@ test("both description and error are linked via aria-describedby", async () => {
622628
await expect.element(Description).toBeVisible();
623629
await expect.element(CheckboxError).toBeVisible();
624630

631+
await expect.element(Description).toHaveAttribute("id");
632+
await expect.element(CheckboxError).toHaveAttribute("id");
633+
await expect.element(Trigger).toHaveAttribute("aria-describedby");
634+
625635
const triggerElement = await Trigger.element();
626636
const descriptionElement = await Description.element();
627637
const errorElement = await CheckboxError.element();
628638
const descriptionId = descriptionElement?.getAttribute("id");
629639
const errorId = errorElement?.getAttribute("id");
630640
const describedBy = triggerElement?.getAttribute("aria-describedby");
631641

632-
expect(descriptionId).toBeTruthy();
633-
expect(errorId).toBeTruthy();
634642
expect(describedBy).toContain(descriptionId as string);
635643
expect(describedBy).toContain(errorId as string);
636644
});

‎libs/components/src/field/field.browser.tsx‎

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -138,12 +138,14 @@ test("description is linked to input via aria-describedby", async () => {
138138
await expect.element(Input).toBeVisible();
139139
await expect.element(Description).toBeVisible();
140140

141+
await expect.element(Description).toHaveAttribute("id");
142+
await expect.element(Input).toHaveAttribute("aria-describedby");
143+
141144
const inputElement = await Input.element();
142145
const descriptionElement = await Description.element();
143146
const descriptionId = descriptionElement?.getAttribute("id");
144147
const describedBy = inputElement?.getAttribute("aria-describedby");
145148

146-
expect(descriptionId).toBeTruthy();
147149
expect(describedBy).toContain(descriptionId as string);
148150
});
149151

@@ -175,12 +177,14 @@ test("error message is linked to input via aria-describedby", async () => {
175177
await expect.element(Input).toBeVisible();
176178
await expect.element(Error).toBeVisible();
177179

180+
await expect.element(Error).toHaveAttribute("id");
181+
await expect.element(Input).toHaveAttribute("aria-describedby");
182+
178183
const inputElement = await Input.element();
179184
const errorElement = await Error.element();
180185
const errorId = errorElement?.getAttribute("id");
181186
const describedBy = inputElement?.getAttribute("aria-describedby");
182187

183-
expect(errorId).toBeTruthy();
184188
expect(describedBy).toContain(errorId as string);
185189
});
186190

@@ -215,15 +219,17 @@ test("both description and error are linked via aria-describedby", async () => {
215219
await expect.element(Description).toBeVisible();
216220
await expect.element(Error).toBeVisible();
217221

222+
await expect.element(Description).toHaveAttribute("id");
223+
await expect.element(Error).toHaveAttribute("id");
224+
await expect.element(Input).toHaveAttribute("aria-describedby");
225+
218226
const inputElement = await Input.element();
219227
const descriptionElement = await Description.element();
220228
const errorElement = await Error.element();
221229
const descriptionId = descriptionElement?.getAttribute("id");
222230
const errorId = errorElement?.getAttribute("id");
223231
const describedBy = inputElement?.getAttribute("aria-describedby");
224232

225-
expect(descriptionId).toBeTruthy();
226-
expect(errorId).toBeTruthy();
227233
expect(describedBy).toContain(descriptionId as string);
228234
expect(describedBy).toContain(errorId as string);
229235
});

‎libs/components/src/otp/otp.browser.tsx‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -33,11 +33,18 @@ test("OTP control should be empty when rendered", async () => {
3333
test("typing numbers should update hidden input", async () => {
3434
render(<Basic />);
3535

36+
await expect.element(Input).toBeVisible();
3637
await userEvent.click(Input);
38+
await expect.element(Input).toHaveFocus();
3739
await userEvent.keyboard("1");
40+
await expect.element(Items.first()).toHaveTextContent("1");
3841
await expect.element(Input).toHaveValue("1");
3942

4043
await userEvent.keyboard("234");
44+
await expect.element(Items.nth(0)).toHaveTextContent("1");
45+
await expect.element(Items.nth(1)).toHaveTextContent("2");
46+
await expect.element(Items.nth(2)).toHaveTextContent("3");
47+
await expect.element(Items.nth(3)).toHaveTextContent("4");
4148
await expect.element(Input).toHaveValue("1234");
4249
});
4350

‎package.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -43,13 +43,13 @@
4343
},
4444
"pnpm": {
4545
"overrides": {
46-
"ansi-regex": "6.2.2",
46+
"ansi-regex": "5.0.1",
4747
"ansi-styles": "6.2.3",
4848
"chalk": "5.6.2",
4949
"color-convert": "3.1.2",
5050
"color-name": "2.0.2",
5151
"debug": "4.4.3",
52-
"strip-ansi": "7.1.2",
52+
"strip-ansi": "6.0.1",
5353
"supports-color": "10.2.2",
5454
"wrap-ansi": "9.0.2"
5555
}

‎pnpm-lock.yaml‎

Lines changed: 16 additions & 16 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)