Skip to content

Commit dcfa402

Browse files
owjs3901owjs3901
committed
Merge remote-tracking branch 'origin/main' into improve-dev
2 parents d3eb6c3 + dd7f8d2 commit dcfa402

56 files changed

Lines changed: 2397 additions & 12 deletions

File tree

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

‎.changepacks/changepack_log_nn6zbR9OpTUg0nwwk6o09.json‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

‎.github/workflows/publish.yml‎

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -84,12 +84,16 @@ jobs:
8484
run: |
8585
rm -rf .rustfmt.toml
8686
cargo fmt
87-
- name: Build Landing
88-
run: |
89-
bun run --filter @devup-ui/components build-storybook
90-
mv ./packages/components/storybook-static ./apps/landing/public/storybook
91-
bun run --filter landing build
92-
- name: Upload artifact
87+
- name: Build Landing
88+
run: |
89+
bun run --filter @devup-ui/components build-storybook
90+
mv ./packages/components/storybook-static ./apps/landing/public/storybook
91+
bun run --filter landing build
92+
- name: Install Playwright Browsers
93+
run: bunx playwright install chromium --with-deps
94+
- name: Run E2E Tests
95+
run: bun run test:e2e
96+
- name: Upload artifact
9397
uses: actions/upload-pages-artifact@v3
9498
with:
9599
path: ./apps/landing/out

‎.gitignore‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -18,3 +18,5 @@ tarpaulin-report.json
1818
storybook-static
1919
.claude
2020
.sisyphus
21+
test-results
22+
playwright-report

‎bindings/devup-ui-wasm/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@
1717
"react",
1818
"wasm"
1919
],
20-
"version": "1.0.62",
20+
"version": "1.0.63",
2121
"scripts": {
2222
"build": "wasm-pack build --target nodejs --out-dir ./pkg --out-name index && node script.js",
2323
"test": "wasm-pack test --node"

‎bun.lock‎

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

‎bunfig.toml‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,5 @@
11
[test]
2+
root = "packages"
23
preload = ["./packages/bun-plugin/src/index.ts", "./bun.setup.ts", "bun-test-env-dom"]
34
coverage = true
45
coverageReporter = ["text", "lcov"]

‎e2e/components-pages.spec.ts‎

Lines changed: 269 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,269 @@
1+
import { expect, test } from '@playwright/test'
2+
3+
test.describe('Components Pages', () => {
4+
test.describe('Components link availability', () => {
5+
test('header has Components link pointing to /components/overview', async ({
6+
browser,
7+
}) => {
8+
const context = await browser.newContext({
9+
javaScriptEnabled: false,
10+
viewport: { width: 1440, height: 900 },
11+
})
12+
const page = await context.newPage()
13+
await page.goto('/')
14+
await page.waitForTimeout(500)
15+
16+
const link = page.locator('a[href="/components/overview"]').first()
17+
await expect(link).toBeVisible()
18+
await expect(link).toHaveAttribute('href', '/components/overview')
19+
await context.close()
20+
})
21+
22+
test('Components link text is correct', async ({ browser }) => {
23+
const context = await browser.newContext({
24+
javaScriptEnabled: false,
25+
viewport: { width: 1440, height: 900 },
26+
})
27+
const page = await context.newPage()
28+
await page.goto('/')
29+
await page.waitForTimeout(500)
30+
31+
const link = page
32+
.locator('a[href="/components/overview"]')
33+
.filter({ hasText: 'Components' })
34+
await expect(link).toBeVisible()
35+
await context.close()
36+
})
37+
38+
test('Components link is hidden on mobile', async ({ browser }) => {
39+
const context = await browser.newContext({
40+
javaScriptEnabled: false,
41+
viewport: { width: 375, height: 812 },
42+
})
43+
const page = await context.newPage()
44+
await page.goto('/')
45+
await page.waitForTimeout(500)
46+
47+
const link = page
48+
.locator('a[href="/components/overview"]')
49+
.filter({ hasText: 'Components' })
50+
const isVisible = await link.isVisible().catch(() => false)
51+
expect(isVisible).toBeFalsy()
52+
await context.close()
53+
})
54+
55+
test('Components link is visible on desktop', async ({ browser }) => {
56+
const context = await browser.newContext({
57+
javaScriptEnabled: false,
58+
viewport: { width: 1440, height: 900 },
59+
})
60+
const page = await context.newPage()
61+
await page.goto('/')
62+
await page.waitForTimeout(500)
63+
64+
const link = page
65+
.locator('a[href="/components/overview"]')
66+
.filter({ hasText: 'Components' })
67+
await expect(link).toBeVisible()
68+
await context.close()
69+
})
70+
})
71+
72+
test.describe('Storybook link', () => {
73+
test('header has Storybook link', async ({ browser }) => {
74+
const context = await browser.newContext({
75+
javaScriptEnabled: false,
76+
viewport: { width: 1440, height: 900 },
77+
})
78+
const page = await context.newPage()
79+
await page.goto('/')
80+
await page.waitForTimeout(500)
81+
82+
const link = page.locator('a[href="/storybook/index.html"]').first()
83+
await expect(link).toBeVisible()
84+
await context.close()
85+
})
86+
87+
test('Storybook link is hidden on mobile', async ({ browser }) => {
88+
const context = await browser.newContext({
89+
javaScriptEnabled: false,
90+
viewport: { width: 375, height: 812 },
91+
})
92+
const page = await context.newPage()
93+
await page.goto('/')
94+
await page.waitForTimeout(500)
95+
96+
const link = page
97+
.locator('a[href="/storybook/index.html"]')
98+
.filter({ hasText: 'Storybook' })
99+
const isVisible = await link.isVisible().catch(() => false)
100+
expect(isVisible).toBeFalsy()
101+
await context.close()
102+
})
103+
})
104+
105+
test.describe('Benchmark section (component showcase on home page)', () => {
106+
test('has Comparison Benchmarks section', async ({ browser }) => {
107+
const context = await browser.newContext({
108+
javaScriptEnabled: false,
109+
viewport: { width: 1440, height: 900 },
110+
})
111+
const page = await context.newPage()
112+
await page.goto('/')
113+
await page.waitForTimeout(500)
114+
115+
await expect(page.getByText('Comparison Bechmarks').first()).toBeVisible()
116+
await context.close()
117+
})
118+
119+
test('shows Devup UI benchmark card', async ({ browser }) => {
120+
const context = await browser.newContext({
121+
javaScriptEnabled: false,
122+
viewport: { width: 1440, height: 900 },
123+
})
124+
const page = await context.newPage()
125+
await page.goto('/')
126+
await page.waitForTimeout(500)
127+
128+
const benchSection = page.getByText('Comparison Bechmarks').first()
129+
await benchSection.scrollIntoViewIfNeeded()
130+
131+
// The Devup UI card is inside a client-side animation wrapper that keeps
132+
// it visually hidden (opacity/transform) when JS is disabled. Verify the
133+
// element exists in the DOM instead.
134+
await expect(
135+
page.locator('.typo-h5', { hasText: 'Devup UI' }).first(),
136+
).toBeAttached()
137+
await context.close()
138+
})
139+
140+
test('shows competitor benchmarks', async ({ browser }) => {
141+
const context = await browser.newContext({
142+
javaScriptEnabled: false,
143+
viewport: { width: 1440, height: 900 },
144+
})
145+
const page = await context.newPage()
146+
await page.goto('/')
147+
await page.waitForTimeout(500)
148+
149+
const benchSection = page.getByText('Comparison Bechmarks').first()
150+
await benchSection.scrollIntoViewIfNeeded()
151+
await page.waitForTimeout(500)
152+
153+
// Check that several competitor names are visible
154+
await expect(page.getByText('Chakra UI').first()).toBeVisible()
155+
await expect(page.getByText('Tailwindcss').first()).toBeVisible()
156+
await context.close()
157+
})
158+
159+
test('desktop benchmark section screenshot', async ({ browser }) => {
160+
const context = await browser.newContext({
161+
javaScriptEnabled: false,
162+
viewport: { width: 1440, height: 900 },
163+
})
164+
const page = await context.newPage()
165+
await page.goto('/')
166+
await page.waitForTimeout(500)
167+
168+
const benchSection = page.getByText('Comparison Bechmarks').first()
169+
await benchSection.scrollIntoViewIfNeeded()
170+
await page.waitForTimeout(500)
171+
172+
await expect(page).toHaveScreenshot(
173+
'components-benchmark-section-desktop.png',
174+
{ fullPage: false },
175+
)
176+
await context.close()
177+
})
178+
179+
test('mobile benchmark section screenshot', async ({ browser }) => {
180+
const context = await browser.newContext({
181+
javaScriptEnabled: false,
182+
viewport: { width: 375, height: 812 },
183+
})
184+
const page = await context.newPage()
185+
await page.goto('/')
186+
await page.waitForTimeout(500)
187+
188+
const benchSection = page.getByText('Comparison Bechmarks').first()
189+
await benchSection.scrollIntoViewIfNeeded()
190+
await page.waitForTimeout(500)
191+
192+
await expect(page).toHaveScreenshot(
193+
'components-benchmark-section-mobile.png',
194+
{ fullPage: false },
195+
)
196+
await context.close()
197+
})
198+
199+
test('dark mode benchmark section screenshot', async ({ browser }) => {
200+
const context = await browser.newContext({
201+
javaScriptEnabled: false,
202+
viewport: { width: 1440, height: 900 },
203+
colorScheme: 'dark',
204+
})
205+
const page = await context.newPage()
206+
await page.goto('/')
207+
await page.waitForTimeout(500)
208+
209+
const benchSection = page.getByText('Comparison Bechmarks').first()
210+
await benchSection.scrollIntoViewIfNeeded()
211+
await page.waitForTimeout(500)
212+
213+
await expect(page).toHaveScreenshot(
214+
'dark-components-benchmark-section-desktop.png',
215+
{ fullPage: false },
216+
)
217+
await context.close()
218+
})
219+
})
220+
221+
test.describe('Community section', () => {
222+
test('has Join our community section', async ({ browser }) => {
223+
const context = await browser.newContext({
224+
javaScriptEnabled: false,
225+
viewport: { width: 1440, height: 900 },
226+
})
227+
const page = await context.newPage()
228+
await page.goto('/')
229+
await page.waitForTimeout(500)
230+
231+
const community = page.getByText('Join our community').first()
232+
await community.scrollIntoViewIfNeeded()
233+
await expect(community).toBeVisible()
234+
await context.close()
235+
})
236+
237+
test('has Discord link', async ({ browser }) => {
238+
const context = await browser.newContext({
239+
javaScriptEnabled: false,
240+
viewport: { width: 1440, height: 900 },
241+
})
242+
const page = await context.newPage()
243+
await page.goto('/')
244+
await page.waitForTimeout(500)
245+
246+
const discordLink = page
247+
.locator('a[href="https://discord.gg/8zjcGc7cWh"]')
248+
.first()
249+
await expect(discordLink).toBeVisible()
250+
await context.close()
251+
})
252+
253+
test('has KakaoTalk link', async ({ browser }) => {
254+
const context = await browser.newContext({
255+
javaScriptEnabled: false,
256+
viewport: { width: 1440, height: 900 },
257+
})
258+
const page = await context.newPage()
259+
await page.goto('/')
260+
await page.waitForTimeout(500)
261+
262+
const kakaoLink = page
263+
.locator('a[href="https://open.kakao.com/o/giONwVAh"]')
264+
.first()
265+
await expect(kakaoLink).toBeVisible()
266+
await context.close()
267+
})
268+
})
269+
})

‎e2e/components-pages.spec.ts-snapshots/components-benchmark-section-desktop.png‎

726 KB
Loading

‎e2e/components-pages.spec.ts-snapshots/components-benchmark-section-mobile.png‎

148 KB
Loading

‎e2e/components-pages.spec.ts-snapshots/dark-components-benchmark-section-desktop.png‎

725 KB
Loading

0 commit comments

Comments
 (0)