microui-wc 0.1.1 → 0.1.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (339) hide show
  1. package/AGENTS.md +71 -71
  2. package/CHANGELOG.md +1 -1
  3. package/README.md +14 -9
  4. package/dist/AGENTS.md +71 -71
  5. package/dist/README.md +14 -9
  6. package/dist/microui.css +1 -1
  7. package/dist/microui.esm.js.map +1 -1
  8. package/dist/microui.min.js.map +1 -1
  9. package/docs/getting-started.md +3 -3
  10. package/package.json +39 -11
  11. package/src/components/mu-schema-form.js +1 -1
  12. package/.github/ISSUE_TEMPLATE/bug_report.md +0 -40
  13. package/.github/ISSUE_TEMPLATE/feature_request.md +0 -33
  14. package/.github/PULL_REQUEST_TEMPLATE.md +0 -28
  15. package/.github/workflows/ci.yml +0 -42
  16. package/.github/workflows/deploy-pages.yml +0 -112
  17. package/CODE_OF_CONDUCT.md +0 -59
  18. package/CONTRIBUTING.md +0 -156
  19. package/SECURITY.md +0 -58
  20. package/app/.generated/routes/alerts.js +0 -8
  21. package/app/.generated/routes/avatars.js +0 -8
  22. package/app/.generated/routes/badges.js +0 -8
  23. package/app/.generated/routes/buttons.js +0 -10
  24. package/app/.generated/routes/cards.js +0 -10
  25. package/app/.generated/routes/checkboxes.js +0 -9
  26. package/app/.generated/routes/chips.js +0 -8
  27. package/app/.generated/routes/dropdowns.js +0 -9
  28. package/app/.generated/routes/home.js +0 -7
  29. package/app/.generated/routes/icons.js +0 -9
  30. package/app/.generated/routes/inputs.js +0 -10
  31. package/app/.generated/routes/installation.js +0 -7
  32. package/app/.generated/routes/layout.js +0 -9
  33. package/app/.generated/routes/modals.js +0 -9
  34. package/app/.generated/routes/navbar.js +0 -7
  35. package/app/.generated/routes/progress.js +0 -9
  36. package/app/.generated/routes/radios.js +0 -9
  37. package/app/.generated/routes/switches.js +0 -9
  38. package/app/.generated/routes/tabs.js +0 -8
  39. package/app/.generated/routes/toasts.js +0 -9
  40. package/app/index.html +0 -67
  41. package/app/pages/alerts.html +0 -23
  42. package/app/pages/avatars.html +0 -22
  43. package/app/pages/badges.html +0 -22
  44. package/app/pages/buttons.html +0 -71
  45. package/app/pages/cards.html +0 -54
  46. package/app/pages/checkboxes.html +0 -39
  47. package/app/pages/chips.html +0 -23
  48. package/app/pages/dropdowns.html +0 -41
  49. package/app/pages/home.html +0 -59
  50. package/app/pages/icons.html +0 -29
  51. package/app/pages/inputs.html +0 -66
  52. package/app/pages/installation.html +0 -34
  53. package/app/pages/layout.html +0 -30
  54. package/app/pages/modals.html +0 -21
  55. package/app/pages/navbar.html +0 -22
  56. package/app/pages/progress.html +0 -35
  57. package/app/pages/radios.html +0 -40
  58. package/app/pages/switches.html +0 -39
  59. package/app/pages/tabs.html +0 -30
  60. package/app/pages/toasts.html +0 -22
  61. package/app-dist/index.html +0 -67
  62. package/app-dist/pages/alerts.html +0 -23
  63. package/app-dist/pages/avatars.html +0 -22
  64. package/app-dist/pages/badges.html +0 -22
  65. package/app-dist/pages/buttons.html +0 -71
  66. package/app-dist/pages/cards.html +0 -54
  67. package/app-dist/pages/checkboxes.html +0 -39
  68. package/app-dist/pages/chips.html +0 -23
  69. package/app-dist/pages/dropdowns.html +0 -41
  70. package/app-dist/pages/home.html +0 -59
  71. package/app-dist/pages/icons.html +0 -29
  72. package/app-dist/pages/inputs.html +0 -66
  73. package/app-dist/pages/installation.html +0 -34
  74. package/app-dist/pages/layout.html +0 -30
  75. package/app-dist/pages/modals.html +0 -21
  76. package/app-dist/pages/navbar.html +0 -22
  77. package/app-dist/pages/progress.html +0 -35
  78. package/app-dist/pages/radios.html +0 -40
  79. package/app-dist/pages/switches.html +0 -39
  80. package/app-dist/pages/tabs.html +0 -30
  81. package/app-dist/pages/toasts.html +0 -22
  82. package/app-dist/pages.json +0 -217
  83. package/app-dist/routes/alerts.js +0 -5
  84. package/app-dist/routes/avatars.js +0 -1
  85. package/app-dist/routes/badges.js +0 -1
  86. package/app-dist/routes/buttons.js +0 -1
  87. package/app-dist/routes/cards.js +0 -1
  88. package/app-dist/routes/checkboxes.js +0 -9
  89. package/app-dist/routes/chips.js +0 -4
  90. package/app-dist/routes/chunk-019e5e2f.js +0 -5
  91. package/app-dist/routes/chunk-0m4j19yd.js +0 -2
  92. package/app-dist/routes/chunk-0tmmp5q0.js +0 -1
  93. package/app-dist/routes/chunk-10xn709r.js +0 -1
  94. package/app-dist/routes/chunk-15m2qcda.js +0 -2
  95. package/app-dist/routes/chunk-1bh8g23n.js +0 -1
  96. package/app-dist/routes/chunk-1vg0v937.js +0 -1
  97. package/app-dist/routes/chunk-1zvcgy3j.js +0 -1
  98. package/app-dist/routes/chunk-2afb0861.js +0 -1
  99. package/app-dist/routes/chunk-2c6ttpzt.js +0 -5
  100. package/app-dist/routes/chunk-3dy30fhs.js +0 -1
  101. package/app-dist/routes/chunk-426dnces.js +0 -13
  102. package/app-dist/routes/chunk-44kgxery.js +0 -1
  103. package/app-dist/routes/chunk-47fdnejd.js +0 -33
  104. package/app-dist/routes/chunk-49a6t2vq.js +0 -1
  105. package/app-dist/routes/chunk-4fe1rm5b.js +0 -1
  106. package/app-dist/routes/chunk-4ggmvkta.js +0 -33
  107. package/app-dist/routes/chunk-4vkz81q7.js +0 -33
  108. package/app-dist/routes/chunk-4w4tmj8f.js +0 -31
  109. package/app-dist/routes/chunk-532s62kr.js +0 -31
  110. package/app-dist/routes/chunk-5hm3bssy.js +0 -33
  111. package/app-dist/routes/chunk-5vrh24hc.js +0 -1
  112. package/app-dist/routes/chunk-61pcg25a.js +0 -1
  113. package/app-dist/routes/chunk-6nfhygvf.js +0 -1
  114. package/app-dist/routes/chunk-700e7je6.js +0 -33
  115. package/app-dist/routes/chunk-7fsn17kg.js +0 -1
  116. package/app-dist/routes/chunk-7k789b32.js +0 -1
  117. package/app-dist/routes/chunk-7r46q0ys.js +0 -36
  118. package/app-dist/routes/chunk-86fmc1fr.js +0 -5
  119. package/app-dist/routes/chunk-8qth37vw.js +0 -1
  120. package/app-dist/routes/chunk-924wv8n0.js +0 -1
  121. package/app-dist/routes/chunk-9mbhgxk9.js +0 -1
  122. package/app-dist/routes/chunk-a216hyd9.js +0 -1
  123. package/app-dist/routes/chunk-akzxykh9.js +0 -33
  124. package/app-dist/routes/chunk-b3dcvy8c.js +0 -1
  125. package/app-dist/routes/chunk-b74zahz5.js +0 -31
  126. package/app-dist/routes/chunk-bftj53p2.js +0 -5
  127. package/app-dist/routes/chunk-c01hnz3e.js +0 -1
  128. package/app-dist/routes/chunk-d8pvv5km.js +0 -1
  129. package/app-dist/routes/chunk-dev0aezr.js +0 -2
  130. package/app-dist/routes/chunk-dh6vnv0e.js +0 -1
  131. package/app-dist/routes/chunk-dn2cbpva.js +0 -36
  132. package/app-dist/routes/chunk-dvn0my90.js +0 -1
  133. package/app-dist/routes/chunk-dvq8mnve.js +0 -36
  134. package/app-dist/routes/chunk-e8c2gc4d.js +0 -5
  135. package/app-dist/routes/chunk-ejf9ak2x.js +0 -1
  136. package/app-dist/routes/chunk-f083m55s.js +0 -1
  137. package/app-dist/routes/chunk-fnrj28s1.js +0 -31
  138. package/app-dist/routes/chunk-fvg3yjdp.js +0 -31
  139. package/app-dist/routes/chunk-g7k381n1.js +0 -1
  140. package/app-dist/routes/chunk-h01kq2ae.js +0 -13
  141. package/app-dist/routes/chunk-h4dk761v.js +0 -5
  142. package/app-dist/routes/chunk-hmx91z2x.js +0 -5
  143. package/app-dist/routes/chunk-hxbg4m42.js +0 -36
  144. package/app-dist/routes/chunk-jbjnfp2b.js +0 -2
  145. package/app-dist/routes/chunk-jxtz5vv6.js +0 -36
  146. package/app-dist/routes/chunk-jxzcs0ey.js +0 -36
  147. package/app-dist/routes/chunk-kt7wwhcx.js +0 -1
  148. package/app-dist/routes/chunk-kzptszyc.js +0 -33
  149. package/app-dist/routes/chunk-mhgca4w4.js +0 -2
  150. package/app-dist/routes/chunk-mhswxa20.js +0 -1
  151. package/app-dist/routes/chunk-n8zfeex6.js +0 -1
  152. package/app-dist/routes/chunk-pee47b2r.js +0 -1
  153. package/app-dist/routes/chunk-pesmw829.js +0 -1
  154. package/app-dist/routes/chunk-pgc4c6f3.js +0 -36
  155. package/app-dist/routes/chunk-q8egegm1.js +0 -1
  156. package/app-dist/routes/chunk-q9mn2qyq.js +0 -36
  157. package/app-dist/routes/chunk-qh0rtaf3.js +0 -5
  158. package/app-dist/routes/chunk-qqhmk6ye.js +0 -2
  159. package/app-dist/routes/chunk-qrxygmf7.js +0 -33
  160. package/app-dist/routes/chunk-r46yzksx.js +0 -36
  161. package/app-dist/routes/chunk-rgpbw2w0.js +0 -5
  162. package/app-dist/routes/chunk-rnpzv3d8.js +0 -2
  163. package/app-dist/routes/chunk-s5v8cv05.js +0 -2
  164. package/app-dist/routes/chunk-sbwn5bpc.js +0 -1
  165. package/app-dist/routes/chunk-sqbg8jbt.js +0 -33
  166. package/app-dist/routes/chunk-sv8dqnf7.js +0 -1
  167. package/app-dist/routes/chunk-t67sw3za.js +0 -1
  168. package/app-dist/routes/chunk-tjdpqwdf.js +0 -31
  169. package/app-dist/routes/chunk-tq2mfghg.js +0 -1
  170. package/app-dist/routes/chunk-ttn10vt6.js +0 -1
  171. package/app-dist/routes/chunk-v2hzpjxr.js +0 -1
  172. package/app-dist/routes/chunk-wfjjkw9y.js +0 -1
  173. package/app-dist/routes/chunk-wt8cxzmf.js +0 -31
  174. package/app-dist/routes/chunk-x45d372k.js +0 -5
  175. package/app-dist/routes/chunk-y3wsazkt.js +0 -1
  176. package/app-dist/routes/chunk-y7pmgc7t.js +0 -33
  177. package/app-dist/routes/chunk-zefdt2q3.js +0 -31
  178. package/app-dist/routes/dropdowns.js +0 -6
  179. package/app-dist/routes/home.js +0 -1
  180. package/app-dist/routes/icons.js +0 -1
  181. package/app-dist/routes/inputs.js +0 -12
  182. package/app-dist/routes/installation.js +0 -1
  183. package/app-dist/routes/layout.js +0 -1
  184. package/app-dist/routes/modals.js +0 -7
  185. package/app-dist/routes/navbar.js +0 -1
  186. package/app-dist/routes/progress.js +0 -1
  187. package/app-dist/routes/radios.js +0 -6
  188. package/app-dist/routes/switches.js +0 -6
  189. package/app-dist/routes/tabs.js +0 -1
  190. package/app-dist/routes/toasts.js +0 -16
  191. package/assets/fonts/material-symbols-mini.woff2 +0 -0
  192. package/assets/fonts/material-symbols.woff2 +0 -0
  193. package/assets/fonts/roboto-400.woff2 +0 -0
  194. package/assets/fonts/roboto-500.woff2 +0 -0
  195. package/assets/fonts/roboto-700.woff2 +0 -0
  196. package/assets/logo-banner-400.jpg +0 -0
  197. package/assets/logo-banner-400.webp +0 -0
  198. package/assets/logo-banner-800.webp +0 -0
  199. package/assets/logo-banner.jpg +0 -0
  200. package/assets/logo-icon-64.jpg +0 -0
  201. package/assets/logo-icon-64.webp +0 -0
  202. package/assets/logo-icon.jpg +0 -0
  203. package/assets/logo-square.jpg +0 -0
  204. package/bun.lock +0 -312
  205. package/bunfig.toml +0 -4
  206. package/custom-elements.json +0 -1916
  207. package/demo/api/sample-data.json +0 -38
  208. package/demo/content/alerts.html +0 -115
  209. package/demo/content/avatars.html +0 -70
  210. package/demo/content/badges.html +0 -65
  211. package/demo/content/buttons.html +0 -188
  212. package/demo/content/callouts.html +0 -91
  213. package/demo/content/cards.html +0 -121
  214. package/demo/content/checkboxes.html +0 -178
  215. package/demo/content/chips.html +0 -67
  216. package/demo/content/codeblocks.html +0 -101
  217. package/demo/content/confirms.html +0 -115
  218. package/demo/content/datatables.html +0 -149
  219. package/demo/content/dividers.html +0 -119
  220. package/demo/content/dropdowns.html +0 -89
  221. package/demo/content/enterprise.html +0 -252
  222. package/demo/content/home.html +0 -149
  223. package/demo/content/icons.html +0 -89
  224. package/demo/content/inputs.html +0 -135
  225. package/demo/content/installation.html +0 -16
  226. package/demo/content/layout.html +0 -136
  227. package/demo/content/modals.html +0 -141
  228. package/demo/content/navbar.html +0 -70
  229. package/demo/content/progress.html +0 -119
  230. package/demo/content/radios.html +0 -88
  231. package/demo/content/skeletons.html +0 -109
  232. package/demo/content/spinners.html +0 -96
  233. package/demo/content/switches.html +0 -84
  234. package/demo/content/tables.html +0 -124
  235. package/demo/content/tabs.html +0 -85
  236. package/demo/content/toasts.html +0 -116
  237. package/demo/content/tooltips.html +0 -107
  238. package/demo/content/virtual-lists.html +0 -233
  239. package/demo/favicon.ico +0 -0
  240. package/demo/favicon.png +0 -0
  241. package/demo/full.html +0 -52
  242. package/demo/iife.html +0 -46
  243. package/demo/manifest.json +0 -34
  244. package/demo/pages/datatable-demo.html +0 -237
  245. package/demo/pages/prompt-ui-demo.html +0 -218
  246. package/demo/pages/responsive-demo.html +0 -122
  247. package/demo/pages/schema-form-demo.html +0 -270
  248. package/demo/robots.txt +0 -6
  249. package/demo/shell.html +0 -712
  250. package/demo/sw.js +0 -387
  251. package/lighthouse-audit.mjs +0 -113
  252. package/scripts/analyze-components.js +0 -105
  253. package/scripts/build-app.js +0 -193
  254. package/scripts/build-framework.js +0 -444
  255. package/scripts/build-utils.js +0 -101
  256. package/scripts/test-isolated.js +0 -151
  257. package/server.js +0 -256
  258. package/tests/agents/agent-integration.test.js +0 -76
  259. package/tests/benchmark.html +0 -296
  260. package/tests/build/scan-components.test.js +0 -173
  261. package/tests/components/all-components.test.js +0 -245
  262. package/tests/components/all-missing-components.test.js +0 -574
  263. package/tests/components/mu-alert.test.js +0 -113
  264. package/tests/components/mu-avatar.test.js +0 -148
  265. package/tests/components/mu-badge.test.js +0 -92
  266. package/tests/components/mu-button.test.js +0 -112
  267. package/tests/components/mu-card.test.js +0 -89
  268. package/tests/components/mu-checkbox.test.js +0 -158
  269. package/tests/components/mu-chip.test.js +0 -118
  270. package/tests/components/mu-container.test.js +0 -120
  271. package/tests/components/mu-divider.test.js +0 -98
  272. package/tests/components/mu-drawer-item.test.js +0 -199
  273. package/tests/components/mu-drawer.test.js +0 -96
  274. package/tests/components/mu-dropdown.test.js +0 -125
  275. package/tests/components/mu-form.test.js +0 -138
  276. package/tests/components/mu-grid.test.js +0 -135
  277. package/tests/components/mu-icon.test.js +0 -110
  278. package/tests/components/mu-input.test.js +0 -131
  279. package/tests/components/mu-lazy.test.js +0 -103
  280. package/tests/components/mu-modal.test.js +0 -275
  281. package/tests/components/mu-navbar.test.js +0 -101
  282. package/tests/components/mu-progress.test.js +0 -115
  283. package/tests/components/mu-radio.test.js +0 -114
  284. package/tests/components/mu-repeat.test.js +0 -106
  285. package/tests/components/mu-sidebar.test.js +0 -126
  286. package/tests/components/mu-skeleton.test.js +0 -162
  287. package/tests/components/mu-stack.test.js +0 -143
  288. package/tests/components/mu-switch.test.js +0 -292
  289. package/tests/components/mu-table.test.js +0 -124
  290. package/tests/components/mu-tabs.test.js +0 -104
  291. package/tests/components/mu-textarea.test.js +0 -115
  292. package/tests/components/mu-toast.test.js +0 -321
  293. package/tests/components/mu-tooltip.test.js +0 -133
  294. package/tests/components/mu-virtual-list.test.js +0 -109
  295. package/tests/core/MuElement.test.js +0 -120
  296. package/tests/core/agent-api.test.js +0 -125
  297. package/tests/core/all-core-modules.test.js +0 -442
  298. package/tests/core/bus.test.js +0 -364
  299. package/tests/core/component-schema.test.js +0 -160
  300. package/tests/core/feature-registry.test.js +0 -198
  301. package/tests/core/form-state.test.js +0 -167
  302. package/tests/core/http.test.js +0 -119
  303. package/tests/core/keyboard.test.js +0 -319
  304. package/tests/core/layers.test.js +0 -129
  305. package/tests/core/namespaced-stores.test.js +0 -114
  306. package/tests/core/render.test.js +0 -121
  307. package/tests/core/ripple.test.js +0 -131
  308. package/tests/core/router.test.js +0 -89
  309. package/tests/core/scheduler.test.js +0 -121
  310. package/tests/core/signals.test.js +0 -128
  311. package/tests/core/store.test.js +0 -171
  312. package/tests/core/transitions.test.js +0 -82
  313. package/tests/e2e/accessibility-harness.html +0 -58
  314. package/tests/e2e/accessibility.test.js +0 -401
  315. package/tests/e2e/agent-features.test.js +0 -372
  316. package/tests/e2e/card-spacing.test.js +0 -287
  317. package/tests/e2e/components.test.js +0 -439
  318. package/tests/e2e/demo-routes.test.js +0 -478
  319. package/tests/e2e/layout-css-fallback.test.js +0 -334
  320. package/tests/e2e/mu-alert.e2e.test.js +0 -111
  321. package/tests/e2e/mu-checkbox.test.js +0 -489
  322. package/tests/e2e/mu-chip.test.js +0 -347
  323. package/tests/e2e/mu-form.test.js +0 -499
  324. package/tests/e2e/mu-icon.test.js +0 -114
  325. package/tests/e2e/mu-radio.test.js +0 -113
  326. package/tests/e2e/mu-skeleton.test.js +0 -140
  327. package/tests/e2e/mu-switch.test.js +0 -415
  328. package/tests/e2e/mu-tabs.test.js +0 -494
  329. package/tests/e2e/mu-textarea.test.js +0 -242
  330. package/tests/e2e/mu-virtual-list.test.js +0 -427
  331. package/tests/e2e/perf-memory.test.js +0 -161
  332. package/tests/e2e/puppeteer-helper.js +0 -137
  333. package/tests/e2e/puppeteer.test.js +0 -226
  334. package/tests/e2e/pwa.test.js +0 -261
  335. package/tests/e2e/test-harness.html +0 -319
  336. package/tests/manual/test-components.html +0 -120
  337. package/tests/memory-test.html +0 -309
  338. package/tests/setup-dom.js +0 -93
  339. package/tests/visual-test.html +0 -301
package/tests/e2e/components.test.js DELETED
@@ -1,439 +0,0 @@
1
- /**
2
- * @fileoverview E2E Tests for All Components requiring real browser
3
- * Covers: mu-button, mu-toast, mu-input, mu-dropdown, theme-toggle, layout, sidebar
4
- */
5
-
6
- import { describe, test, expect, beforeAll, afterAll } from 'bun:test';
7
- import { launchBrowser, puppeteer } from './puppeteer-helper.js';
8
- import { fileURLToPath } from 'url';
9
- import { dirname, join } from 'path';
10
- import { mkdirSync, rmSync } from 'fs';
11
-
12
- const __filename = fileURLToPath(import.meta.url);
13
- const __dirname = dirname(__filename);
14
-
15
- describe('Components E2E Tests', () => {
16
- let browser;
17
- let page;
18
- let server;
19
- const userDataDir = `./.tmp/puppeteer-components-${Date.now()}-${Math.random().toString(36).slice(2)}`;
20
-
21
- beforeAll(async () => {
22
- mkdirSync(userDataDir, { recursive: true });
23
-
24
- const projectRoot = join(__dirname, '../..');
25
- server = Bun.serve({
26
- port: 0,
27
- async fetch(req) {
28
- const url = new URL(req.url);
29
- let filePath = join(projectRoot, url.pathname);
30
-
31
- if (url.pathname === '/') {
32
- return new Response(`<!DOCTYPE html>
33
- <html data-theme="light">
34
- <head>
35
- <title>Component Test</title>
36
- <link rel="stylesheet" href="/dist/microui.min.css">
37
- <style>
38
- :root {
39
- --mu-color-primary: #6750a4;
40
- --mu-color-surface: #ffffff;
41
- }
42
- [data-theme="dark"] {
43
- --mu-color-primary: #cfbcff;
44
- --mu-color-surface: #1c1b1f;
45
- }
46
- .app-main { min-height: 100vh; }
47
- .sidebar { position: sticky; top: 0; max-height: 100vh; overflow-y: auto; }
48
- .page { display: none; }
49
- .page.active { display: block; }
50
- </style>
51
- </head>
52
- <body>
53
- <div class="app-main">
54
- <nav class="sidebar">
55
- <a href="#home" data-page="home" class="sidebar-link active">Home</a>
56
- <a href="#about" data-page="about" class="sidebar-link">About</a>
57
- </nav>
58
- <main>
59
- <div class="page active" id="home">Home Page</div>
60
- <div class="page" id="about">About Page</div>
61
- </main>
62
- </div>
63
-
64
- <mu-button id="btn1" variant="filled" size="md">Primary Button</mu-button>
65
- <mu-button id="btn2" variant="text" size="lg">Text Button</mu-button>
66
- <mu-button id="btn-disabled" disabled>Disabled</mu-button>
67
- <mu-input id="input1" label="Email" placeholder="Enter email"></mu-input>
68
- <mu-dropdown id="dropdown1">
69
- <span slot="trigger">Select</span>
70
- <mu-option value="1">Option 1</mu-option>
71
- <mu-option value="2">Option 2</mu-option>
72
- </mu-dropdown>
73
- <mu-toast id="toast1" severity="info">Test Toast</mu-toast>
74
- <mu-checkbox id="check1">Accept Terms</mu-checkbox>
75
- <mu-switch id="switch1">Enable Feature</mu-switch>
76
- <mu-theme-toggle id="theme-toggle"></mu-theme-toggle>
77
-
78
- <script src="/dist/microui.min.js"></script>
79
- <script>
80
- function showPage(pageId) {
81
- window.scrollTo(0, 0);
82
- document.querySelectorAll('.page').forEach(p => p.classList.remove('active'));
83
- document.getElementById(pageId)?.classList.add('active');
84
- }
85
- </script>
86
- </body>
87
- </html>`, { headers: { 'Content-Type': 'text/html' } });
88
- }
89
-
90
- try {
91
- const file = Bun.file(filePath);
92
- if (!await file.exists()) {
93
- return new Response('Not Found', { status: 404 });
94
- }
95
- const content = await file.text();
96
- const ext = filePath.split('.').pop();
97
- const mimeTypes = { 'html': 'text/html', 'js': 'text/javascript', 'css': 'text/css' };
98
- return new Response(content, { headers: { 'Content-Type': mimeTypes[ext] || 'text/plain' } });
99
- } catch (e) {
100
- return new Response('Error: ' + e.message, { status: 500 });
101
- }
102
- }
103
- });
104
-
105
- browser = await launchBrowser({ testName: 'e2e' });
106
- page = await browser.newPage();
107
- await page.goto(`http://localhost:${server.port}`, { waitUntil: 'networkidle0', timeout: 30000 });
108
- await page.waitForFunction(() => typeof window.microUI !== 'undefined', { timeout: 15000 });
109
- }, 60000);
110
-
111
- afterAll(async () => {
112
- await browser?.close();
113
- server?.stop();
114
- try { rmSync(userDataDir, { recursive: true, force: true }); } catch { }
115
- });
116
-
117
- // ========================================
118
- // MU-BUTTON COMPONENT
119
- // ========================================
120
-
121
- describe('mu-button Component', () => {
122
- test('should be registered as custom element', async () => {
123
- const result = await page.evaluate(() => customElements.get('mu-button') !== undefined);
124
- expect(result).toBe(true);
125
- });
126
-
127
- test('should render with base class', async () => {
128
- const result = await page.evaluate(() => {
129
- const btn = document.querySelector('mu-button');
130
- return btn && btn.classList.contains('mu-button');
131
- });
132
- expect(result).toBe(true);
133
- });
134
-
135
- test('should apply variant attribute', async () => {
136
- const result = await page.evaluate(() => {
137
- const btn = document.querySelector('mu-button[variant="filled"]');
138
- return btn && btn.classList.contains('mu-button--filled');
139
- });
140
- expect(result).toBe(true);
141
- });
142
-
143
- test('should apply size attribute', async () => {
144
- const result = await page.evaluate(() => {
145
- const btn = document.querySelector('mu-button[size="lg"]');
146
- return btn && btn.classList.contains('mu-button--lg');
147
- });
148
- expect(result).toBe(true);
149
- });
150
-
151
- test('should have role=button', async () => {
152
- const result = await page.evaluate(() => {
153
- const btn = document.querySelector('mu-button');
154
- return btn && btn.getAttribute('role') === 'button';
155
- });
156
- expect(result).toBe(true);
157
- });
158
-
159
- test('should have tabindex=0 by default', async () => {
160
- const result = await page.evaluate(() => {
161
- const btn = document.querySelector('mu-button:not([disabled])');
162
- return btn && btn.getAttribute('tabindex') === '0';
163
- });
164
- expect(result).toBe(true);
165
- });
166
-
167
- test('should have tabindex=-1 when disabled', async () => {
168
- const result = await page.evaluate(() => {
169
- const btn = document.querySelector('mu-button[disabled]');
170
- return btn && btn.getAttribute('tabindex') === '-1';
171
- });
172
- expect(result).toBe(true);
173
- });
174
-
175
- test('should add is-disabled class when disabled', async () => {
176
- const result = await page.evaluate(() => {
177
- const btn = document.querySelector('mu-button[disabled]');
178
- return btn && btn.classList.contains('is-disabled');
179
- });
180
- expect(result).toBe(true);
181
- });
182
- });
183
-
184
- // ========================================
185
- // MU-INPUT COMPONENT
186
- // ========================================
187
-
188
- describe('mu-input Component', () => {
189
- test('should be registered', async () => {
190
- const result = await page.evaluate(() => customElements.get('mu-input') !== undefined);
191
- expect(result).toBe(true);
192
- });
193
-
194
- test('should render input field', async () => {
195
- const result = await page.evaluate(() => {
196
- const input = document.querySelector('mu-input');
197
- return input && input.querySelector('input') !== null;
198
- });
199
- expect(result).toBe(true);
200
- });
201
-
202
- test('should have label', async () => {
203
- const result = await page.evaluate(() => {
204
- const input = document.querySelector('mu-input[label]');
205
- return input && (input.querySelector('label') !== null || input.textContent.includes('Email'));
206
- });
207
- expect(result).toBe(true);
208
- });
209
- });
210
-
211
- // ========================================
212
- // MU-DROPDOWN COMPONENT
213
- // ========================================
214
-
215
- describe('mu-dropdown Component', () => {
216
- test('should be registered', async () => {
217
- const result = await page.evaluate(() => customElements.get('mu-dropdown') !== undefined);
218
- expect(result).toBe(true);
219
- });
220
-
221
- test('should have trigger element', async () => {
222
- const result = await page.evaluate(() => {
223
- const dropdown = document.querySelector('mu-dropdown');
224
- // Check for slotted trigger or internal button
225
- return dropdown && (
226
- dropdown.querySelector('[slot="trigger"]') !== null ||
227
- dropdown.querySelector('button') !== null ||
228
- dropdown.shadowRoot?.querySelector('button') !== null
229
- );
230
- });
231
- expect(result).toBe(true);
232
- });
233
-
234
- test('should have open/close/toggle methods', async () => {
235
- const result = await page.evaluate(() => {
236
- const dropdown = document.querySelector('mu-dropdown');
237
- return dropdown &&
238
- typeof dropdown.open === 'function' &&
239
- typeof dropdown.close === 'function' &&
240
- typeof dropdown.toggle === 'function';
241
- });
242
- expect(result).toBe(true);
243
- });
244
- });
245
-
246
- // ========================================
247
- // MU-TOAST COMPONENT
248
- // ========================================
249
-
250
- describe('mu-toast Component', () => {
251
- test('should be registered', async () => {
252
- const result = await page.evaluate(() => customElements.get('mu-toast') !== undefined);
253
- expect(result).toBe(true);
254
- });
255
-
256
- test('should have severity attribute', async () => {
257
- const result = await page.evaluate(() => {
258
- const toast = document.querySelector('mu-toast');
259
- return toast && toast.hasAttribute('severity');
260
- });
261
- expect(result).toBe(true);
262
- });
263
- });
264
-
265
- // ========================================
266
- // THEME TOGGLE
267
- // ========================================
268
-
269
- describe('Theme Toggle', () => {
270
- test('should have CSS variables in :root', async () => {
271
- const result = await page.evaluate(() => {
272
- const style = getComputedStyle(document.documentElement);
273
- return style.getPropertyValue('--mu-color-primary').trim().length > 0;
274
- });
275
- expect(result).toBe(true);
276
- });
277
-
278
- test('mu-theme-toggle should be registered', async () => {
279
- const result = await page.evaluate(() => customElements.get('mu-theme-toggle') !== undefined);
280
- expect(result).toBe(true);
281
- });
282
-
283
- test('should be able to set data-theme attribute', async () => {
284
- const result = await page.evaluate(() => {
285
- document.documentElement.setAttribute('data-theme', 'dark');
286
- const isDark = document.documentElement.getAttribute('data-theme') === 'dark';
287
- document.documentElement.setAttribute('data-theme', 'light');
288
- return isDark;
289
- });
290
- expect(result).toBe(true);
291
- });
292
-
293
- test('should toggle between light and dark', async () => {
294
- const result = await page.evaluate(() => {
295
- document.documentElement.setAttribute('data-theme', 'light');
296
- const wasLight = document.documentElement.getAttribute('data-theme') === 'light';
297
- document.documentElement.setAttribute('data-theme', 'dark');
298
- const nowDark = document.documentElement.getAttribute('data-theme') === 'dark';
299
- document.documentElement.setAttribute('data-theme', 'light');
300
- return wasLight && nowDark;
301
- });
302
- expect(result).toBe(true);
303
- });
304
- });
305
-
306
- // ========================================
307
- // LAYOUT STABILITY
308
- // ========================================
309
-
310
- describe('Layout Stability', () => {
311
- test('should have min-height on .app-main', async () => {
312
- const result = await page.evaluate(() => {
313
- const main = document.querySelector('.app-main');
314
- if (!main) return false;
315
- const style = getComputedStyle(main);
316
- return parseInt(style.minHeight) > 0;
317
- });
318
- expect(result).toBe(true);
319
- });
320
-
321
- test('should have sticky positioned sidebar', async () => {
322
- const result = await page.evaluate(() => {
323
- const sidebar = document.querySelector('.sidebar');
324
- if (!sidebar) return false;
325
- const style = getComputedStyle(sidebar);
326
- return style.position === 'sticky';
327
- });
328
- expect(result).toBe(true);
329
- });
330
-
331
- test('should have page elements with display:none by default', async () => {
332
- const result = await page.evaluate(() => {
333
- const inactivePage = document.querySelector('.page:not(.active)');
334
- if (!inactivePage) return true; // If no inactive pages, test passes
335
- const style = getComputedStyle(inactivePage);
336
- return style.display === 'none';
337
- });
338
- expect(result).toBe(true);
339
- });
340
-
341
- test('should have .page.active with display:block', async () => {
342
- const result = await page.evaluate(() => {
343
- const activePage = document.querySelector('.page.active');
344
- if (!activePage) return false;
345
- const style = getComputedStyle(activePage);
346
- return style.display === 'block';
347
- });
348
- expect(result).toBe(true);
349
- });
350
- });
351
-
352
- // ========================================
353
- // SIDEBAR NAVIGATION
354
- // ========================================
355
-
356
- describe('Sidebar Navigation', () => {
357
- test('should have sidebar element', async () => {
358
- const result = await page.evaluate(() => document.querySelector('.sidebar') !== null);
359
- expect(result).toBe(true);
360
- });
361
-
362
- test('should have sidebar links with data-page attributes', async () => {
363
- const result = await page.evaluate(() => {
364
- const links = document.querySelectorAll('.sidebar-link[data-page]');
365
- return links.length > 0;
366
- });
367
- expect(result).toBe(true);
368
- });
369
-
370
- test('should have one active sidebar link by default', async () => {
371
- const result = await page.evaluate(() => {
372
- const activeLinks = document.querySelectorAll('.sidebar-link.active');
373
- return activeLinks.length === 1;
374
- });
375
- expect(result).toBe(true);
376
- });
377
-
378
- test('should have matching page elements for sidebar links', async () => {
379
- const result = await page.evaluate(() => {
380
- const links = document.querySelectorAll('.sidebar-link[data-page]');
381
- for (const link of links) {
382
- const pageId = link.getAttribute('data-page');
383
- if (!document.getElementById(pageId)) return false;
384
- }
385
- return true;
386
- });
387
- expect(result).toBe(true);
388
- });
389
-
390
- test('should have exactly one active page by default', async () => {
391
- const result = await page.evaluate(() => {
392
- const activePages = document.querySelectorAll('.page.active');
393
- return activePages.length === 1;
394
- });
395
- expect(result).toBe(true);
396
- });
397
- });
398
-
399
- // ========================================
400
- // NAVIGATION SCROLL RESET
401
- // ========================================
402
-
403
- describe('Navigation Scroll Reset', () => {
404
- test('showPage function should exist', async () => {
405
- const result = await page.evaluate(() => typeof window.showPage === 'function');
406
- expect(result).toBe(true);
407
- });
408
-
409
- test('showPage should scroll to top', async () => {
410
- const result = await page.evaluate(() => {
411
- window.scrollTo(0, 100);
412
- window.showPage('about');
413
- return window.scrollY === 0;
414
- });
415
- expect(result).toBe(true);
416
- });
417
- });
418
-
419
- // ========================================
420
- // OTHER COMPONENTS
421
- // ========================================
422
-
423
- describe('Other Components', () => {
424
- test('mu-checkbox should be registered', async () => {
425
- const result = await page.evaluate(() => customElements.get('mu-checkbox') !== undefined);
426
- expect(result).toBe(true);
427
- });
428
-
429
- test('mu-switch should be registered', async () => {
430
- const result = await page.evaluate(() => customElements.get('mu-switch') !== undefined);
431
- expect(result).toBe(true);
432
- });
433
-
434
- test('mu-option should be registered', async () => {
435
- const result = await page.evaluate(() => customElements.get('mu-option') !== undefined);
436
- expect(result).toBe(true);
437
- });
438
- });
439
- });