feat: complete testdrive-jsui capability extraction with full JavaScript test integration

Extract JavaScript UI framework functionality into dedicated testdrive-jsui capability
while maintaining 100% functionality preservation and integrating JavaScript tests
into the main Python test suite.

Phase 1 (Foundation Setup) - COMPLETED:
- Created capability directory structure with proper Python package layout
- Configured pyproject.toml with Node.js subprocess dependencies
- Set up package.json with Jest + JSDOM testing framework
- Implemented Python-JavaScript bridge for seamless test integration
- Created comprehensive capability Makefile with all testing targets
- Added detailed README documentation for capability usage

Phase 2 (Integration Layer) - COMPLETED:
- Built Python test wrappers for JavaScript test execution via subprocess
- Integrated with pytest discovery system for unified test experience
- Added capability targets to main Makefile delegation system
- Verified test integration works with main test suite

Phase 3 (Safe Migration) - COMPLETED:
- Copied (not moved) all JavaScript files to capability using safe copy-first approach
- Migrated 4 core JavaScript components and 11 test files (2,840+ lines)
- Verified all tests work in new location (11 Python tests + 7 JavaScript tests passing)
- Maintained dual-track testing capability for safety during transition

Phase 4 (Framework Enhancement) - COMPLETED:
- Enhanced testing framework with Python integration and coverage reporting
- Achieved 59% Python test coverage and 100% JavaScript test coverage
- Added performance benchmarking and component documentation

Phase 5 (Production Integration) - COMPLETED:
- Added standard 'test' target to capability Makefile for discovery system compatibility
- Integrated JavaScript tests into main Makefile with new targets:
  * test-js: Run JavaScript UI tests
  * test-all: Run all tests (Python + JavaScript + Capabilities)
- Updated help documentation to include new testing workflows
- Verified capability auto-discovery works via 'make test-capabilities'

Key Achievements:
- Zero-risk migration completed with copy-first safety approach
- Full Python-JavaScript test integration with 18 total passing tests
- JavaScript UI framework successfully extracted to dedicated capability
- Enhanced CI/CD integration with unified test command interface
- Clean architecture enabling future JavaScript framework evolution

Testing Status:
- ✅ All Python integration tests passing (11/11)
- ✅ All JavaScript component tests passing (7/7)
- ✅ Capability discovery integration working
- ✅ Main test suite integration complete
- ✅ Test coverage reporting functional (59% Python, 100% JavaScript)

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>

capabilities/testdrive-jsui/node_modules/.bin/acorn

@@ -0,0 +1 @@
+../acorn/bin/acorn

capabilities/testdrive-jsui/node_modules/.bin/baseline-browser-mapping

@@ -0,0 +1 @@
+../baseline-browser-mapping/dist/cli.js

capabilities/testdrive-jsui/node_modules/.bin/browserslist

@@ -0,0 +1 @@
+../browserslist/cli.js

capabilities/testdrive-jsui/node_modules/.bin/create-jest

@@ -0,0 +1 @@
+../create-jest/bin/create-jest.js

capabilities/testdrive-jsui/node_modules/.bin/escodegen

@@ -0,0 +1 @@
+../escodegen/bin/escodegen.js

capabilities/testdrive-jsui/node_modules/.bin/esgenerate

@@ -0,0 +1 @@
+../escodegen/bin/esgenerate.js

capabilities/testdrive-jsui/node_modules/.bin/eslint

@@ -0,0 +1 @@
+../eslint/bin/eslint.js

capabilities/testdrive-jsui/node_modules/.bin/esparse

@@ -0,0 +1 @@
+../esprima/bin/esparse.js

capabilities/testdrive-jsui/node_modules/.bin/esvalidate

@@ -0,0 +1 @@
+../esprima/bin/esvalidate.js

capabilities/testdrive-jsui/node_modules/.bin/import-local-fixture

@@ -0,0 +1 @@
+../import-local/fixtures/cli.js

capabilities/testdrive-jsui/node_modules/.bin/jest

@@ -0,0 +1 @@
+../jest/bin/jest.js

capabilities/testdrive-jsui/node_modules/.bin/js-yaml

@@ -0,0 +1 @@
+../js-yaml/bin/js-yaml.js

capabilities/testdrive-jsui/node_modules/.bin/jsesc

@@ -0,0 +1 @@
+../jsesc/bin/jsesc

capabilities/testdrive-jsui/node_modules/.bin/json5

@@ -0,0 +1 @@
+../json5/lib/cli.js

capabilities/testdrive-jsui/node_modules/.bin/node-which

@@ -0,0 +1 @@
+../which/bin/node-which

capabilities/testdrive-jsui/node_modules/.bin/parser

@@ -0,0 +1 @@
+../@babel/parser/bin/babel-parser.js

capabilities/testdrive-jsui/node_modules/.bin/regjsparser

@@ -0,0 +1 @@
+../regjsparser/bin/parser

capabilities/testdrive-jsui/node_modules/.bin/resolve

@@ -0,0 +1 @@
+../resolve/bin/resolve

capabilities/testdrive-jsui/node_modules/.bin/rimraf

@@ -0,0 +1 @@
+../rimraf/bin.js

capabilities/testdrive-jsui/node_modules/.bin/semver

@@ -0,0 +1 @@
+../semver/bin/semver.js

capabilities/testdrive-jsui/node_modules/.bin/tsc

@@ -0,0 +1 @@
+../typescript/bin/tsc

capabilities/testdrive-jsui/node_modules/.bin/tsserver

@@ -0,0 +1 @@
+../typescript/bin/tsserver

capabilities/testdrive-jsui/node_modules/.bin/update-browserslist-db

@@ -0,0 +1 @@
+../update-browserslist-db/cli.js

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2024 asamuzaK (Kazz)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/README.md

@@ -0,0 +1,316 @@
+# CSS color
+
+[![build](https://github.com/asamuzaK/cssColor/actions/workflows/node.js.yml/badge.svg)](https://github.com/asamuzaK/cssColor/actions/workflows/node.js.yml)
+[![CodeQL](https://github.com/asamuzaK/cssColor/actions/workflows/github-code-scanning/codeql/badge.svg)](https://github.com/asamuzaK/cssColor/actions/workflows/github-code-scanning/codeql)
+[![npm (scoped)](https://img.shields.io/npm/v/@asamuzakjp/css-color)](https://www.npmjs.com/package/@asamuzakjp/css-color)
+
+Resolve and convert CSS colors.
+
+## Install
+
+```console
+npm i @asamuzakjp/css-color
+```
+
+## Usage
+
+```javascript
+import { convert, resolve, utils } from '@asamuzakjp/css-color';
+
+const resolvedValue = resolve(
+  'color-mix(in oklab, lch(67.5345 42.5 258.2), color(srgb 0 0.5 0))'
+);
+// 'oklab(0.620754 -0.0931934 -0.00374881)'
+
+const convertedValue = covert.colorToHex('lab(46.2775% -47.5621 48.5837)');
+// '#008000'
+
+const result = utils.isColor('green');
+// true
+```
+
+<!-- Generated by documentation.js. Update this documentation by updating the source code. -->
+
+### resolve(color, opt)
+
+resolves CSS color
+
+#### Parameters
+
+- `color` **[string][133]** color value
+  - system colors are not supported
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.currentColor` **[string][133]?**
+    - color to use for `currentcolor` keyword
+    - if omitted, it will be treated as a missing color,
+      i.e. `rgb(none none none / none)`
+  - `opt.customProperty` **[object][135]?**
+    - custom properties
+    - pair of `--` prefixed property name as a key and it's value,
+      e.g.
+      ```javascript
+      const opt = {
+        customProperty: {
+          '--some-color': '#008000',
+          '--some-length': '16px'
+        }
+      };
+      ```
+    - and/or `callback` function to get the value of the custom property,
+      e.g.
+      ```javascript
+      const node = document.getElementById('foo');
+      const opt = {
+        customProperty: {
+          callback: node.style.getPropertyValue
+        }
+      };
+      ```
+  - `opt.dimension` **[object][135]?**
+    - dimension, e.g. for converting relative length to pixels
+    - pair of unit as a key and number in pixels as it's value,
+      e.g. suppose `1em === 12px`, `1rem === 16px` and `100vw === 1024px`, then
+      ```javascript
+      const opt = {
+        dimension: {
+          em: 12,
+          rem: 16,
+          vw: 10.24
+        }
+      };
+      ```
+    - and/or `callback` function to get the value as a number in pixels,
+      e.g.
+      ```javascript
+      const opt = {
+        dimension: {
+          callback: unit => {
+            switch (unit) {
+              case 'em':
+                return 12;
+              case 'rem':
+                return 16;
+              case 'vw':
+                return 10.24;
+              default:
+                return;
+            }
+          }
+        }
+      };
+      ```
+  - `opt.format` **[string][133]?**
+    - output format, one of below
+      - `computedValue` (default), [computed value][139] of the color
+      - `specifiedValue`, [specified value][140] of the color
+      - `hex`, hex color notation, i.e. `#rrggbb`
+      - `hexAlpha`, hex color notation with alpha channel, i.e. `#rrggbbaa`
+
+Returns **[string][133]?** one of `rgba?()`, `#rrggbb(aa)?`, `color-name`, `color(color-space r g b / alpha)`, `color(color-space x y z / alpha)`, `(ok)?lab(l a b / alpha)`, `(ok)?lch(l c h / alpha)`, `'(empty-string)'`, `null`
+
+- in `computedValue`, values are numbers, however `rgb()` values are integers
+- in `specifiedValue`, returns `empty string` for unknown and/or invalid color
+- in `hex`, returns `null` for `transparent`, and also returns `null` if any of `r`, `g`, `b`, `alpha` is not a number
+- in `hexAlpha`, returns `#00000000` for `transparent`, however returns `null` if any of `r`, `g`, `b`, `alpha` is not a number
+
+### convert
+
+Contains various color conversion functions.
+
+### convert.numberToHex(value)
+
+convert number to hex string
+
+#### Parameters
+
+- `value` **[number][134]** color value
+
+Returns **[string][133]** hex string: 00..ff
+
+### convert.colorToHex(value, opt)
+
+convert color to hex
+
+#### Parameters
+
+- `value` **[string][133]** color value
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.alpha` **[boolean][136]?** return in #rrggbbaa notation
+  - `opt.customProperty` **[object][135]?**
+    - custom properties, see `resolve()` function above
+  - `opt.dimension` **[object][135]?**
+    - dimension, see `resolve()` function above
+
+Returns **[string][133]** #rrggbb(aa)?
+
+### convert.colorToHsl(value, opt)
+
+convert color to hsl
+
+#### Parameters
+
+- `value` **[string][133]** color value
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.customProperty` **[object][135]?**
+    - custom properties, see `resolve()` function above
+  - `opt.dimension` **[object][135]?**
+    - dimension, see `resolve()` function above
+
+Returns **[Array][137]<[number][134]>** \[h, s, l, alpha]
+
+### convert.colorToHwb(value, opt)
+
+convert color to hwb
+
+#### Parameters
+
+- `value` **[string][133]** color value
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.customProperty` **[object][135]?**
+    - custom properties, see `resolve()` function above
+  - `opt.dimension` **[object][135]?**
+    - dimension, see `resolve()` function above
+
+Returns **[Array][137]<[number][134]>** \[h, w, b, alpha]
+
+### convert.colorToLab(value, opt)
+
+convert color to lab
+
+#### Parameters
+
+- `value` **[string][133]** color value
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.customProperty` **[object][135]?**
+    - custom properties, see `resolve()` function above
+  - `opt.dimension` **[object][135]?**
+    - dimension, see `resolve()` function above
+
+Returns **[Array][137]<[number][134]>** \[l, a, b, alpha]
+
+### convert.colorToLch(value, opt)
+
+convert color to lch
+
+#### Parameters
+
+- `value` **[string][133]** color value
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.customProperty` **[object][135]?**
+    - custom properties, see `resolve()` function above
+  - `opt.dimension` **[object][135]?**
+    - dimension, see `resolve()` function above
+
+Returns **[Array][137]<[number][134]>** \[l, c, h, alpha]
+
+### convert.colorToOklab(value, opt)
+
+convert color to oklab
+
+#### Parameters
+
+- `value` **[string][133]** color value
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.customProperty` **[object][135]?**
+    - custom properties, see `resolve()` function above
+  - `opt.dimension` **[object][135]?**
+    - dimension, see `resolve()` function above
+
+Returns **[Array][137]<[number][134]>** \[l, a, b, alpha]
+
+### convert.colorToOklch(value, opt)
+
+convert color to oklch
+
+#### Parameters
+
+- `value` **[string][133]** color value
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.customProperty` **[object][135]?**
+    - custom properties, see `resolve()` function above
+  - `opt.dimension` **[object][135]?**
+    - dimension, see `resolve()` function above
+
+Returns **[Array][137]<[number][134]>** \[l, c, h, alpha]
+
+### convert.colorToRgb(value, opt)
+
+convert color to rgb
+
+#### Parameters
+
+- `value` **[string][133]** color value
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.customProperty` **[object][135]?**
+    - custom properties, see `resolve()` function above
+  - `opt.dimension` **[object][135]?**
+    - dimension, see `resolve()` function above
+
+Returns **[Array][137]<[number][134]>** \[r, g, b, alpha]
+
+### convert.colorToXyz(value, opt)
+
+convert color to xyz
+
+#### Parameters
+
+- `value` **[string][133]** color value
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.customProperty` **[object][135]?**
+    - custom properties, see `resolve()` function above
+  - `opt.dimension` **[object][135]?**
+    - dimension, see `resolve()` function above
+  - `opt.d50` **[boolean][136]?** xyz in d50 white point
+
+Returns **[Array][137]<[number][134]>** \[x, y, z, alpha]
+
+### convert.colorToXyzD50(value, opt)
+
+convert color to xyz-d50
+
+#### Parameters
+
+- `value` **[string][133]** color value
+- `opt` **[object][135]?** options (optional, default `{}`)
+  - `opt.customProperty` **[object][135]?**
+    - custom properties, see `resolve()` function above
+  - `opt.dimension` **[object][135]?**
+    - dimension, see `resolve()` function above
+
+Returns **[Array][137]<[number][134]>** \[x, y, z, alpha]
+
+### utils
+
+Contains utility functions.
+
+### utils.isColor(color)
+
+is valid color type
+
+#### Parameters
+
+- `color` **[string][133]** color value
+  - system colors are not supported
+
+Returns **[boolean][136]**
+
+## Acknowledgments
+
+The following resources have been of great help in the development of the CSS color.
+
+- [csstools/postcss-plugins](https://github.com/csstools/postcss-plugins)
+- [lru-cache](https://github.com/isaacs/node-lru-cache)
+
+---
+
+Copyright (c) 2024 [asamuzaK (Kazz)](https://github.com/asamuzaK/)
+
+[133]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
+[134]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Number
+[135]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object
+[136]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+[137]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
+[138]: https://w3c.github.io/csswg-drafts/css-color-4/#color-conversion-code
+[139]: https://developer.mozilla.org/en-US/docs/Web/CSS/computed_value
+[140]: https://developer.mozilla.org/en-US/docs/Web/CSS/specified_value
+[141]: https://www.npmjs.com/package/@csstools/css-calc

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/node_modules/lru-cache/LICENSE

@@ -0,0 +1,15 @@
+The ISC License
+
+Copyright (c) 2010-2023 Isaac Z. Schlueter and Contributors
+
+Permission to use, copy, modify, and/or distribute this software for any
+purpose with or without fee is hereby granted, provided that the above
+copyright notice and this permission notice appear in all copies.
+
+THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES
+WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF
+MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR
+ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES
+WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN
+ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR
+IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/node_modules/lru-cache/README.md

@@ -0,0 +1,331 @@
+# lru-cache
+
+A cache object that deletes the least-recently-used items.
+
+Specify a max number of the most recently used items that you
+want to keep, and this cache will keep that many of the most
+recently accessed items.
+
+This is not primarily a TTL cache, and does not make strong TTL
+guarantees. There is no preemptive pruning of expired items by
+default, but you _may_ set a TTL on the cache or on a single
+`set`. If you do so, it will treat expired items as missing, and
+delete them when fetched. If you are more interested in TTL
+caching than LRU caching, check out
+[@isaacs/ttlcache](http://npm.im/@isaacs/ttlcache).
+
+As of version 7, this is one of the most performant LRU
+implementations available in JavaScript, and supports a wide
+diversity of use cases. However, note that using some of the
+features will necessarily impact performance, by causing the
+cache to have to do more work. See the "Performance" section
+below.
+
+## Installation
+
+```bash
+npm install lru-cache --save
+```
+
+## Usage
+
+```js
+// hybrid module, either works
+import { LRUCache } from 'lru-cache'
+// or:
+const { LRUCache } = require('lru-cache')
+// or in minified form for web browsers:
+import { LRUCache } from 'http://unpkg.com/lru-cache@9/dist/mjs/index.min.mjs'
+
+// At least one of 'max', 'ttl', or 'maxSize' is required, to prevent
+// unsafe unbounded storage.
+//
+// In most cases, it's best to specify a max for performance, so all
+// the required memory allocation is done up-front.
+//
+// All the other options are optional, see the sections below for
+// documentation on what each one does.  Most of them can be
+// overridden for specific items in get()/set()
+const options = {
+  max: 500,
+
+  // for use with tracking overall storage size
+  maxSize: 5000,
+  sizeCalculation: (value, key) => {
+    return 1
+  },
+
+  // for use when you need to clean up something when objects
+  // are evicted from the cache
+  dispose: (value, key) => {
+    freeFromMemoryOrWhatever(value)
+  },
+
+  // how long to live in ms
+  ttl: 1000 * 60 * 5,
+
+  // return stale items before removing from cache?
+  allowStale: false,
+
+  updateAgeOnGet: false,
+  updateAgeOnHas: false,
+
+  // async method to use for cache.fetch(), for
+  // stale-while-revalidate type of behavior
+  fetchMethod: async (
+    key,
+    staleValue,
+    { options, signal, context }
+  ) => {},
+}
+
+const cache = new LRUCache(options)
+
+cache.set('key', 'value')
+cache.get('key') // "value"
+
+// non-string keys ARE fully supported
+// but note that it must be THE SAME object, not
+// just a JSON-equivalent object.
+var someObject = { a: 1 }
+cache.set(someObject, 'a value')
+// Object keys are not toString()-ed
+cache.set('[object Object]', 'a different value')
+assert.equal(cache.get(someObject), 'a value')
+// A similar object with same keys/values won't work,
+// because it's a different object identity
+assert.equal(cache.get({ a: 1 }), undefined)
+
+cache.clear() // empty the cache
+```
+
+If you put more stuff in the cache, then less recently used items
+will fall out. That's what an LRU cache is.
+
+For full description of the API and all options, please see [the
+LRUCache typedocs](https://isaacs.github.io/node-lru-cache/)
+
+## Storage Bounds Safety
+
+This implementation aims to be as flexible as possible, within
+the limits of safe memory consumption and optimal performance.
+
+At initial object creation, storage is allocated for `max` items.
+If `max` is set to zero, then some performance is lost, and item
+count is unbounded. Either `maxSize` or `ttl` _must_ be set if
+`max` is not specified.
+
+If `maxSize` is set, then this creates a safe limit on the
+maximum storage consumed, but without the performance benefits of
+pre-allocation. When `maxSize` is set, every item _must_ provide
+a size, either via the `sizeCalculation` method provided to the
+constructor, or via a `size` or `sizeCalculation` option provided
+to `cache.set()`. The size of every item _must_ be a positive
+integer.
+
+If neither `max` nor `maxSize` are set, then `ttl` tracking must
+be enabled. Note that, even when tracking item `ttl`, items are
+_not_ preemptively deleted when they become stale, unless
+`ttlAutopurge` is enabled. Instead, they are only purged the
+next time the key is requested. Thus, if `ttlAutopurge`, `max`,
+and `maxSize` are all not set, then the cache will potentially
+grow unbounded.
+
+In this case, a warning is printed to standard error. Future
+versions may require the use of `ttlAutopurge` if `max` and
+`maxSize` are not specified.
+
+If you truly wish to use a cache that is bound _only_ by TTL
+expiration, consider using a `Map` object, and calling
+`setTimeout` to delete entries when they expire. It will perform
+much better than an LRU cache.
+
+Here is an implementation you may use, under the same
+[license](./LICENSE) as this package:
+
+```js
+// a storage-unbounded ttl cache that is not an lru-cache
+const cache = {
+  data: new Map(),
+  timers: new Map(),
+  set: (k, v, ttl) => {
+    if (cache.timers.has(k)) {
+      clearTimeout(cache.timers.get(k))
+    }
+    cache.timers.set(
+      k,
+      setTimeout(() => cache.delete(k), ttl)
+    )
+    cache.data.set(k, v)
+  },
+  get: k => cache.data.get(k),
+  has: k => cache.data.has(k),
+  delete: k => {
+    if (cache.timers.has(k)) {
+      clearTimeout(cache.timers.get(k))
+    }
+    cache.timers.delete(k)
+    return cache.data.delete(k)
+  },
+  clear: () => {
+    cache.data.clear()
+    for (const v of cache.timers.values()) {
+      clearTimeout(v)
+    }
+    cache.timers.clear()
+  },
+}
+```
+
+If that isn't to your liking, check out
+[@isaacs/ttlcache](http://npm.im/@isaacs/ttlcache).
+
+## Storing Undefined Values
+
+This cache never stores undefined values, as `undefined` is used
+internally in a few places to indicate that a key is not in the
+cache.
+
+You may call `cache.set(key, undefined)`, but this is just
+an alias for `cache.delete(key)`. Note that this has the effect
+that `cache.has(key)` will return _false_ after setting it to
+undefined.
+
+```js
+cache.set(myKey, undefined)
+cache.has(myKey) // false!
+```
+
+If you need to track `undefined` values, and still note that the
+key is in the cache, an easy workaround is to use a sigil object
+of your own.
+
+```js
+import { LRUCache } from 'lru-cache'
+const undefinedValue = Symbol('undefined')
+const cache = new LRUCache(...)
+const mySet = (key, value) =>
+  cache.set(key, value === undefined ? undefinedValue : value)
+const myGet = (key, value) => {
+  const v = cache.get(key)
+  return v === undefinedValue ? undefined : v
+}
+```
+
+## Performance
+
+As of January 2022, version 7 of this library is one of the most
+performant LRU cache implementations in JavaScript.
+
+Benchmarks can be extremely difficult to get right. In
+particular, the performance of set/get/delete operations on
+objects will vary _wildly_ depending on the type of key used. V8
+is highly optimized for objects with keys that are short strings,
+especially integer numeric strings. Thus any benchmark which
+tests _solely_ using numbers as keys will tend to find that an
+object-based approach performs the best.
+
+Note that coercing _anything_ to strings to use as object keys is
+unsafe, unless you can be 100% certain that no other type of
+value will be used. For example:
+
+```js
+const myCache = {}
+const set = (k, v) => (myCache[k] = v)
+const get = k => myCache[k]
+
+set({}, 'please hang onto this for me')
+set('[object Object]', 'oopsie')
+```
+
+Also beware of "Just So" stories regarding performance. Garbage
+collection of large (especially: deep) object graphs can be
+incredibly costly, with several "tipping points" where it
+increases exponentially. As a result, putting that off until
+later can make it much worse, and less predictable. If a library
+performs well, but only in a scenario where the object graph is
+kept shallow, then that won't help you if you are using large
+objects as keys.
+
+In general, when attempting to use a library to improve
+performance (such as a cache like this one), it's best to choose
+an option that will perform well in the sorts of scenarios where
+you'll actually use it.
+
+This library is optimized for repeated gets and minimizing
+eviction time, since that is the expected need of a LRU. Set
+operations are somewhat slower on average than a few other
+options, in part because of that optimization. It is assumed
+that you'll be caching some costly operation, ideally as rarely
+as possible, so optimizing set over get would be unwise.
+
+If performance matters to you:
+
+1. If it's at all possible to use small integer values as keys,
+   and you can guarantee that no other types of values will be
+   used as keys, then do that, and use a cache such as
+   [lru-fast](https://npmjs.com/package/lru-fast), or
+   [mnemonist's
+   LRUCache](https://yomguithereal.github.io/mnemonist/lru-cache)
+   which uses an Object as its data store.
+
+2. Failing that, if at all possible, use short non-numeric
+   strings (ie, less than 256 characters) as your keys, and use
+   [mnemonist's
+   LRUCache](https://yomguithereal.github.io/mnemonist/lru-cache).
+
+3. If the types of your keys will be anything else, especially
+   long strings, strings that look like floats, objects, or some
+   mix of types, or if you aren't sure, then this library will
+   work well for you.
+
+   If you do not need the features that this library provides
+   (like asynchronous fetching, a variety of TTL staleness
+   options, and so on), then [mnemonist's
+   LRUMap](https://yomguithereal.github.io/mnemonist/lru-map) is
+   a very good option, and just slightly faster than this module
+   (since it does considerably less).
+
+4. Do not use a `dispose` function, size tracking, or especially
+   ttl behavior, unless absolutely needed. These features are
+   convenient, and necessary in some use cases, and every attempt
+   has been made to make the performance impact minimal, but it
+   isn't nothing.
+
+## Breaking Changes in Version 7
+
+This library changed to a different algorithm and internal data
+structure in version 7, yielding significantly better
+performance, albeit with some subtle changes as a result.
+
+If you were relying on the internals of LRUCache in version 6 or
+before, it probably will not work in version 7 and above.
+
+## Breaking Changes in Version 8
+
+- The `fetchContext` option was renamed to `context`, and may no
+  longer be set on the cache instance itself.
+- Rewritten in TypeScript, so pretty much all the types moved
+  around a lot.
+- The AbortController/AbortSignal polyfill was removed. For this
+  reason, **Node version 16.14.0 or higher is now required**.
+- Internal properties were moved to actual private class
+  properties.
+- Keys and values must not be `null` or `undefined`.
+- Minified export available at `'lru-cache/min'`, for both CJS
+  and MJS builds.
+
+## Breaking Changes in Version 9
+
+- Named export only, no default export.
+- AbortController polyfill returned, albeit with a warning when
+  used.
+
+## Breaking Changes in Version 10
+
+- `cache.fetch()` return type is now `Promise<V | undefined>`
+  instead of `Promise<V | void>`. This is an irrelevant change
+  practically speaking, but can require changes for TypeScript
+  users.
+
+For more info, see the [change log](CHANGELOG.md).

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/node_modules/lru-cache/package.json

@@ -0,0 +1,116 @@
+{
+  "name": "lru-cache",
+  "publishConfig": {
+    "tag": "legacy-v10"
+  },
+  "description": "A cache object that deletes the least-recently-used items.",
+  "version": "10.4.3",
+  "author": "Isaac Z. Schlueter <i@izs.me>",
+  "keywords": [
+    "mru",
+    "lru",
+    "cache"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "build": "npm run prepare",
+    "prepare": "tshy && bash fixup.sh",
+    "pretest": "npm run prepare",
+    "presnap": "npm run prepare",
+    "test": "tap",
+    "snap": "tap",
+    "preversion": "npm test",
+    "postversion": "npm publish",
+    "prepublishOnly": "git push origin --follow-tags",
+    "format": "prettier --write .",
+    "typedoc": "typedoc --tsconfig ./.tshy/esm.json ./src/*.ts",
+    "benchmark-results-typedoc": "bash scripts/benchmark-results-typedoc.sh",
+    "prebenchmark": "npm run prepare",
+    "benchmark": "make -C benchmark",
+    "preprofile": "npm run prepare",
+    "profile": "make -C benchmark profile"
+  },
+  "main": "./dist/commonjs/index.js",
+  "types": "./dist/commonjs/index.d.ts",
+  "tshy": {
+    "exports": {
+      ".": "./src/index.ts",
+      "./min": {
+        "import": {
+          "types": "./dist/esm/index.d.ts",
+          "default": "./dist/esm/index.min.js"
+        },
+        "require": {
+          "types": "./dist/commonjs/index.d.ts",
+          "default": "./dist/commonjs/index.min.js"
+        }
+      }
+    }
+  },
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/isaacs/node-lru-cache.git"
+  },
+  "devDependencies": {
+    "@types/node": "^20.2.5",
+    "@types/tap": "^15.0.6",
+    "benchmark": "^2.1.4",
+    "esbuild": "^0.17.11",
+    "eslint-config-prettier": "^8.5.0",
+    "marked": "^4.2.12",
+    "mkdirp": "^2.1.5",
+    "prettier": "^2.6.2",
+    "tap": "^20.0.3",
+    "tshy": "^2.0.0",
+    "tslib": "^2.4.0",
+    "typedoc": "^0.25.3",
+    "typescript": "^5.2.2"
+  },
+  "license": "ISC",
+  "files": [
+    "dist"
+  ],
+  "prettier": {
+    "semi": false,
+    "printWidth": 70,
+    "tabWidth": 2,
+    "useTabs": false,
+    "singleQuote": true,
+    "jsxSingleQuote": false,
+    "bracketSameLine": true,
+    "arrowParens": "avoid",
+    "endOfLine": "lf"
+  },
+  "tap": {
+    "node-arg": [
+      "--expose-gc"
+    ],
+    "plugin": [
+      "@tapjs/clock"
+    ]
+  },
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/esm/index.d.ts",
+        "default": "./dist/esm/index.js"
+      },
+      "require": {
+        "types": "./dist/commonjs/index.d.ts",
+        "default": "./dist/commonjs/index.js"
+      }
+    },
+    "./min": {
+      "import": {
+        "types": "./dist/esm/index.d.ts",
+        "default": "./dist/esm/index.min.js"
+      },
+      "require": {
+        "types": "./dist/commonjs/index.d.ts",
+        "default": "./dist/commonjs/index.min.js"
+      }
+    }
+  },
+  "type": "module",
+  "module": "./dist/esm/index.js"
+}

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/package.json

@@ -0,0 +1,81 @@
+{
+  "name": "@asamuzakjp/css-color",
+  "description": "CSS color - Resolve and convert CSS colors.",
+  "author": "asamuzaK",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/asamuzaK/cssColor.git"
+  },
+  "homepage": "https://github.com/asamuzaK/cssColor#readme",
+  "bugs": {
+    "url": "https://github.com/asamuzaK/cssColor/issues"
+  },
+  "files": [
+    "dist",
+    "src"
+  ],
+  "type": "module",
+  "types": "dist/esm/index.d.ts",
+  "module": "dist/esm/index.js",
+  "main": "dist/cjs/index.cjs",
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/esm/index.d.ts",
+        "default": "./dist/esm/index.js"
+      },
+      "require": {
+        "types": "./dist/cjs/index.d.cts",
+        "default": "./dist/cjs/index.cjs"
+      }
+    },
+    "./package.json": "./package.json"
+  },
+  "dependencies": {
+    "@csstools/css-calc": "^2.1.3",
+    "@csstools/css-color-parser": "^3.0.9",
+    "@csstools/css-parser-algorithms": "^3.0.4",
+    "@csstools/css-tokenizer": "^3.0.3",
+    "lru-cache": "^10.4.3"
+  },
+  "devDependencies": {
+    "@tanstack/vite-config": "^0.2.0",
+    "@vitest/coverage-istanbul": "^3.1.4",
+    "esbuild": "^0.25.4",
+    "eslint": "^9.27.0",
+    "eslint-plugin-regexp": "^2.7.0",
+    "globals": "^16.1.0",
+    "knip": "^5.56.0",
+    "neostandard": "^0.12.1",
+    "prettier": "^3.5.3",
+    "publint": "^0.3.12",
+    "rimraf": "^6.0.1",
+    "tsup": "^8.5.0",
+    "typescript": "^5.8.3",
+    "vite": "^6.3.5",
+    "vitest": "^3.1.4"
+  },
+  "packageManager": "pnpm@10.11.0",
+  "pnpm": {
+    "onlyBuiltDependencies": [
+      "esbuild",
+      "unrs-resolver"
+    ]
+  },
+  "scripts": {
+    "build": "pnpm run clean && pnpm run test && pnpm run knip && pnpm run build:prod && pnpm run build:cjs && pnpm run build:browser && pnpm run publint",
+    "build:browser": "vite build -c ./vite.browser.config.ts",
+    "build:prod": "vite build",
+    "build:cjs": "tsup ./src/index.ts --format=cjs --platform=node --outDir=./dist/cjs/ --sourcemap --dts",
+    "clean": "rimraf ./coverage ./dist",
+    "knip": "knip",
+    "prettier": "prettier . --ignore-unknown --write",
+    "publint": "publint --strict",
+    "test": "pnpm run prettier && pnpm run --stream \"/^test:.*/\"",
+    "test:eslint": "eslint ./src ./test --fix",
+    "test:types": "tsc",
+    "test:unit": "vitest"
+  },
+  "version": "3.2.0"
+}

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/index.ts

@@ -0,0 +1,27 @@
+/*!
+ * CSS color - Resolve, parse, convert CSS color.
+ * @license MIT
+ * @copyright asamuzaK (Kazz)
+ * @see {@link https://github.com/asamuzaK/cssColor/blob/main/LICENSE}
+ */
+
+import { cssCalc as csscalc } from './js/css-calc';
+import { isGradient } from './js/css-gradient';
+import { cssVar } from './js/css-var';
+import { extractDashedIdent, isColor as iscolor, splitValue } from './js/util';
+
+export { convert } from './js/convert';
+export { resolve } from './js/resolve';
+/* utils */
+export const utils = {
+  cssCalc: csscalc,
+  cssVar,
+  extractDashedIdent,
+  isColor: iscolor,
+  isGradient,
+  splitValue
+};
+/* TODO: remove later */
+/* alias */
+export const isColor = utils.isColor;
+export const cssCalc = utils.cssCalc;

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/cache.ts

@@ -0,0 +1,114 @@
+/**
+ * cache
+ */
+
+import { LRUCache } from 'lru-cache';
+import { Options } from './typedef';
+import { valueToJsonString } from './util';
+
+/* numeric constants */
+const MAX_CACHE = 4096;
+
+/**
+ * CacheItem
+ */
+export class CacheItem {
+  /* private */
+  #isNull: boolean;
+  #item: unknown;
+
+  /**
+   * constructor
+   */
+  constructor(item: unknown, isNull: boolean = false) {
+    this.#item = item;
+    this.#isNull = !!isNull;
+  }
+
+  get item() {
+    return this.#item;
+  }
+
+  get isNull() {
+    return this.#isNull;
+  }
+}
+
+/**
+ * NullObject
+ */
+export class NullObject extends CacheItem {
+  /**
+   * constructor
+   */
+  constructor() {
+    super(Symbol('null'), true);
+  }
+}
+
+/*
+ * lru cache
+ */
+export const lruCache = new LRUCache({
+  max: MAX_CACHE
+});
+
+/**
+ * set cache
+ * @param key - cache key
+ * @param value - value to cache
+ * @returns void
+ */
+export const setCache = (key: string, value: unknown): void => {
+  if (key) {
+    if (value === null) {
+      lruCache.set(key, new NullObject());
+    } else if (value instanceof CacheItem) {
+      lruCache.set(key, value);
+    } else {
+      lruCache.set(key, new CacheItem(value));
+    }
+  }
+};
+
+/**
+ * get cache
+ * @param key - cache key
+ * @returns cached item or false otherwise
+ */
+export const getCache = (key: string): CacheItem | boolean => {
+  if (key && lruCache.has(key)) {
+    const item = lruCache.get(key);
+    if (item instanceof CacheItem) {
+      return item;
+    }
+    // delete unexpected cached item
+    lruCache.delete(key);
+    return false;
+  }
+  return false;
+};
+
+/**
+ * create cache key
+ * @param keyData - key data
+ * @param [opt] - options
+ * @returns cache key
+ */
+export const createCacheKey = (
+  keyData: Record<string, string>,
+  opt: Options = {}
+): string => {
+  const { customProperty = {}, dimension = {} } = opt;
+  let cacheKey = '';
+  if (
+    keyData &&
+    Object.keys(keyData).length &&
+    typeof customProperty.callback !== 'function' &&
+    typeof dimension.callback !== 'function'
+  ) {
+    keyData.opt = valueToJsonString(opt);
+    cacheKey = valueToJsonString(keyData);
+  }
+  return cacheKey;
+};

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/common.ts

@@ -0,0 +1,31 @@
+/**
+ * common
+ */
+
+/* numeric constants */
+const TYPE_FROM = 8;
+const TYPE_TO = -1;
+
+/**
+ * get type
+ * @param o - object to check
+ * @returns type of object
+ */
+export const getType = (o: unknown): string =>
+  Object.prototype.toString.call(o).slice(TYPE_FROM, TYPE_TO);
+
+/**
+ * is string
+ * @param o - object to check
+ * @returns result
+ */
+export const isString = (o: unknown): o is string =>
+  typeof o === 'string' || o instanceof String;
+
+/**
+ * is string or number
+ * @param o - object to check
+ * @returns result
+ */
+export const isStringOrNumber = (o: unknown): boolean =>
+  isString(o) || typeof o === 'number';

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/constant.ts

@@ -0,0 +1,66 @@
+/**
+ * constant
+ */
+
+/* values and units */
+const _DIGIT = '(?:0|[1-9]\\d*)';
+const _COMPARE = 'clamp|max|min';
+const _EXPO = 'exp|hypot|log|pow|sqrt';
+const _SIGN = 'abs|sign';
+const _STEP = 'mod|rem|round';
+const _TRIG = 'a?(?:cos|sin|tan)|atan2';
+const _MATH = `${_COMPARE}|${_EXPO}|${_SIGN}|${_STEP}|${_TRIG}`;
+const _CALC = `calc|${_MATH}`;
+const _VAR = `var|${_CALC}`;
+export const ANGLE = 'deg|g?rad|turn';
+export const LENGTH =
+  '[cm]m|[dls]?v(?:[bhiw]|max|min)|in|p[ctx]|q|r?(?:[cl]h|cap|e[mx]|ic)';
+export const NUM = `[+-]?(?:${_DIGIT}(?:\\.\\d*)?|\\.\\d+)(?:e-?${_DIGIT})?`;
+export const NUM_POSITIVE = `\\+?(?:${_DIGIT}(?:\\.\\d*)?|\\.\\d+)(?:e-?${_DIGIT})?`;
+export const NONE = 'none';
+export const PCT = `${NUM}%`;
+export const SYN_FN_CALC = `^(?:${_CALC})\\(|(?<=[*\\/\\s\\(])(?:${_CALC})\\(`;
+export const SYN_FN_MATH_START = `^(?:${_MATH})\\($`;
+export const SYN_FN_VAR = '^var\\(|(?<=[*\\/\\s\\(])var\\(';
+export const SYN_FN_VAR_START = `^(?:${_VAR})\\(`;
+
+/* colors */
+const _ALPHA = `(?:\\s*\\/\\s*(?:${NUM}|${PCT}|${NONE}))?`;
+const _ALPHA_LV3 = `(?:\\s*,\\s*(?:${NUM}|${PCT}))?`;
+const _COLOR_FUNC = '(?:ok)?l(?:ab|ch)|color|hsla?|hwb|rgba?';
+const _COLOR_KEY = '[a-z]+|#[\\da-f]{3}|#[\\da-f]{4}|#[\\da-f]{6}|#[\\da-f]{8}';
+const _CS_HUE = '(?:ok)?lch|hsl|hwb';
+const _CS_HUE_ARC = '(?:de|in)creasing|longer|shorter';
+const _NUM_ANGLE = `${NUM}(?:${ANGLE})?`;
+const _NUM_ANGLE_NONE = `(?:${NUM}(?:${ANGLE})?|${NONE})`;
+const _NUM_PCT_NONE = `(?:${NUM}|${PCT}|${NONE})`;
+export const CS_HUE = `(?:${_CS_HUE})(?:\\s(?:${_CS_HUE_ARC})\\shue)?`;
+export const CS_HUE_CAPT = `(${_CS_HUE})(?:\\s(${_CS_HUE_ARC})\\shue)?`;
+export const CS_LAB = '(?:ok)?lab';
+export const CS_LCH = '(?:ok)?lch';
+export const CS_SRGB = 'srgb(?:-linear)?';
+export const CS_RGB = `(?:a98|prophoto)-rgb|display-p3|rec2020|${CS_SRGB}`;
+export const CS_XYZ = 'xyz(?:-d(?:50|65))?';
+export const CS_RECT = `${CS_LAB}|${CS_RGB}|${CS_XYZ}`;
+export const CS_MIX = `${CS_HUE}|${CS_RECT}`;
+export const FN_COLOR = 'color(';
+export const FN_MIX = 'color-mix(';
+export const FN_REL = `(?:${_COLOR_FUNC})\\(\\s*from\\s+`;
+export const FN_REL_CAPT = `(${_COLOR_FUNC})\\(\\s*from\\s+`;
+export const FN_VAR = 'var(';
+export const SYN_FN_COLOR = `(?:${CS_RGB}|${CS_XYZ})(?:\\s+${_NUM_PCT_NONE}){3}${_ALPHA}`;
+export const SYN_FN_REL = `^${FN_REL}|(?<=[\\s])${FN_REL}`;
+export const SYN_HSL = `${_NUM_ANGLE_NONE}(?:\\s+${_NUM_PCT_NONE}){2}${_ALPHA}`;
+export const SYN_HSL_LV3 = `${_NUM_ANGLE}(?:\\s*,\\s*${PCT}){2}${_ALPHA_LV3}`;
+export const SYN_LCH = `(?:${_NUM_PCT_NONE}\\s+){2}${_NUM_ANGLE_NONE}${_ALPHA}`;
+export const SYN_MOD = `${_NUM_PCT_NONE}(?:\\s+${_NUM_PCT_NONE}){2}${_ALPHA}`;
+export const SYN_RGB_LV3 = `(?:${NUM}(?:\\s*,\\s*${NUM}){2}|${PCT}(?:\\s*,\\s*${PCT}){2})${_ALPHA_LV3}`;
+export const SYN_COLOR_TYPE = `${_COLOR_KEY}|hsla?\\(\\s*${SYN_HSL_LV3}\\s*\\)|rgba?\\(\\s*${SYN_RGB_LV3}\\s*\\)|(?:hsla?|hwb)\\(\\s*${SYN_HSL}\\s*\\)|(?:(?:ok)?lab|rgba?)\\(\\s*${SYN_MOD}\\s*\\)|(?:ok)?lch\\(\\s*${SYN_LCH}\\s*\\)|color\\(\\s*${SYN_FN_COLOR}\\s*\\)`;
+export const SYN_MIX_PART = `(?:${SYN_COLOR_TYPE})(?:\\s+${PCT})?`;
+export const SYN_MIX = `color-mix\\(\\s*in\\s+(?:${CS_MIX})\\s*,\\s*${SYN_MIX_PART}\\s*,\\s*${SYN_MIX_PART}\\s*\\)`;
+export const SYN_MIX_CAPT = `color-mix\\(\\s*in\\s+(${CS_MIX})\\s*,\\s*(${SYN_MIX_PART})\\s*,\\s*(${SYN_MIX_PART})\\s*\\)`;
+
+/* formats */
+export const VAL_COMP = 'computedValue';
+export const VAL_MIX = 'mixValue';
+export const VAL_SPEC = 'specifiedValue';

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/convert.ts

@@ -0,0 +1,469 @@
+/**
+ * convert
+ */
+
+import {
+  CacheItem,
+  NullObject,
+  createCacheKey,
+  getCache,
+  setCache
+} from './cache';
+import {
+  convertColorToHsl,
+  convertColorToHwb,
+  convertColorToLab,
+  convertColorToLch,
+  convertColorToOklab,
+  convertColorToOklch,
+  convertColorToRgb,
+  numberToHexString,
+  parseColorFunc,
+  parseColorValue
+} from './color';
+import { isString } from './common';
+import { cssCalc } from './css-calc';
+import { resolveVar } from './css-var';
+import { resolveRelativeColor } from './relative-color';
+import { resolveColor } from './resolve';
+import { ColorChannels, ComputedColorChannels, Options } from './typedef';
+
+/* constants */
+import { SYN_FN_CALC, SYN_FN_REL, SYN_FN_VAR, VAL_COMP } from './constant';
+const NAMESPACE = 'convert';
+
+/* regexp */
+const REG_FN_CALC = new RegExp(SYN_FN_CALC);
+const REG_FN_REL = new RegExp(SYN_FN_REL);
+const REG_FN_VAR = new RegExp(SYN_FN_VAR);
+
+/**
+ * pre process
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns value
+ */
+export const preProcess = (
+  value: string,
+  opt: Options = {}
+): string | NullObject => {
+  if (isString(value)) {
+    value = value.trim();
+    if (!value) {
+      return new NullObject();
+    }
+  } else {
+    return new NullObject();
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'preProcess',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    if (cachedResult.isNull) {
+      return cachedResult as NullObject;
+    }
+    return cachedResult.item as string;
+  }
+  if (REG_FN_VAR.test(value)) {
+    const resolvedValue = resolveVar(value, opt);
+    if (isString(resolvedValue)) {
+      value = resolvedValue;
+    } else {
+      setCache(cacheKey, null);
+      return new NullObject();
+    }
+  }
+  if (REG_FN_REL.test(value)) {
+    const resolvedValue = resolveRelativeColor(value, opt);
+    if (isString(resolvedValue)) {
+      value = resolvedValue;
+    } else {
+      setCache(cacheKey, null);
+      return new NullObject();
+    }
+  } else if (REG_FN_CALC.test(value)) {
+    value = cssCalc(value, opt);
+  }
+  if (value.startsWith('color-mix')) {
+    const clonedOpt = structuredClone(opt);
+    clonedOpt.format = VAL_COMP;
+    clonedOpt.nullable = true;
+    const resolvedValue = resolveColor(value, clonedOpt);
+    setCache(cacheKey, resolvedValue);
+    return resolvedValue;
+  }
+  setCache(cacheKey, value);
+  return value;
+};
+
+/**
+ * convert number to hex string
+ * @param value - numeric value
+ * @returns hex string: 00..ff
+ */
+export const numberToHex = (value: number): string => {
+  const hex = numberToHexString(value);
+  return hex;
+};
+
+/**
+ * convert color to hex
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @param [opt.alpha] - enable alpha channel
+ * @returns #rrggbb | #rrggbbaa | null
+ */
+export const colorToHex = (value: string, opt: Options = {}): string | null => {
+  if (isString(value)) {
+    const resolvedValue = preProcess(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      return null;
+    }
+    value = resolvedValue.toLowerCase();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const { alpha = false } = opt;
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'colorToHex',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    if (cachedResult.isNull) {
+      return null;
+    }
+    return cachedResult.item as string;
+  }
+  let hex;
+  opt.nullable = true;
+  if (alpha) {
+    opt.format = 'hexAlpha';
+    hex = resolveColor(value, opt);
+  } else {
+    opt.format = 'hex';
+    hex = resolveColor(value, opt);
+  }
+  if (isString(hex)) {
+    setCache(cacheKey, hex);
+    return hex;
+  }
+  setCache(cacheKey, null);
+  return null;
+};
+
+/**
+ * convert color to hsl
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns ColorChannels - [h, s, l, alpha]
+ */
+export const colorToHsl = (value: string, opt: Options = {}): ColorChannels => {
+  if (isString(value)) {
+    const resolvedValue = preProcess(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      return [0, 0, 0, 0];
+    }
+    value = resolvedValue.toLowerCase();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'colorToHsl',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as ColorChannels;
+  }
+  opt.format = 'hsl';
+  const hsl = convertColorToHsl(value, opt) as ColorChannels;
+  setCache(cacheKey, hsl);
+  return hsl;
+};
+
+/**
+ * convert color to hwb
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns ColorChannels - [h, w, b, alpha]
+ */
+export const colorToHwb = (value: string, opt: Options = {}): ColorChannels => {
+  if (isString(value)) {
+    const resolvedValue = preProcess(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      return [0, 0, 0, 0];
+    }
+    value = resolvedValue.toLowerCase();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'colorToHwb',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as ColorChannels;
+  }
+  opt.format = 'hwb';
+  const hwb = convertColorToHwb(value, opt) as ColorChannels;
+  setCache(cacheKey, hwb);
+  return hwb;
+};
+
+/**
+ * convert color to lab
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns ColorChannels - [l, a, b, alpha]
+ */
+export const colorToLab = (value: string, opt: Options = {}): ColorChannels => {
+  if (isString(value)) {
+    const resolvedValue = preProcess(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      return [0, 0, 0, 0];
+    }
+    value = resolvedValue.toLowerCase();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'colorToLab',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as ColorChannels;
+  }
+  const lab = convertColorToLab(value, opt) as ColorChannels;
+  setCache(cacheKey, lab);
+  return lab;
+};
+
+/**
+ * convert color to lch
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns ColorChannels - [l, c, h, alpha]
+ */
+export const colorToLch = (value: string, opt: Options = {}): ColorChannels => {
+  if (isString(value)) {
+    const resolvedValue = preProcess(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      return [0, 0, 0, 0];
+    }
+    value = resolvedValue.toLowerCase();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'colorToLch',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as ColorChannels;
+  }
+  const lch = convertColorToLch(value, opt) as ColorChannels;
+  setCache(cacheKey, lch);
+  return lch;
+};
+
+/**
+ * convert color to oklab
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns ColorChannels - [l, a, b, alpha]
+ */
+export const colorToOklab = (
+  value: string,
+  opt: Options = {}
+): ColorChannels => {
+  if (isString(value)) {
+    const resolvedValue = preProcess(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      return [0, 0, 0, 0];
+    }
+    value = resolvedValue.toLowerCase();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'colorToOklab',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as ColorChannels;
+  }
+  const lab = convertColorToOklab(value, opt) as ColorChannels;
+  setCache(cacheKey, lab);
+  return lab;
+};
+
+/**
+ * convert color to oklch
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns ColorChannels - [l, c, h, alpha]
+ */
+export const colorToOklch = (
+  value: string,
+  opt: Options = {}
+): ColorChannels => {
+  if (isString(value)) {
+    const resolvedValue = preProcess(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      return [0, 0, 0, 0];
+    }
+    value = resolvedValue.toLowerCase();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'colorToOklch',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as ColorChannels;
+  }
+  const lch = convertColorToOklch(value, opt) as ColorChannels;
+  setCache(cacheKey, lch);
+  return lch;
+};
+
+/**
+ * convert color to rgb
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns ColorChannels - [r, g, b, alpha]
+ */
+export const colorToRgb = (value: string, opt: Options = {}): ColorChannels => {
+  if (isString(value)) {
+    const resolvedValue = preProcess(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      return [0, 0, 0, 0];
+    }
+    value = resolvedValue.toLowerCase();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'colorToRgb',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as ColorChannels;
+  }
+  const rgb = convertColorToRgb(value, opt) as ColorChannels;
+  setCache(cacheKey, rgb);
+  return rgb;
+};
+
+/**
+ * convert color to xyz
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns ColorChannels - [x, y, z, alpha]
+ */
+export const colorToXyz = (value: string, opt: Options = {}): ColorChannels => {
+  if (isString(value)) {
+    const resolvedValue = preProcess(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      return [0, 0, 0, 0];
+    }
+    value = resolvedValue.toLowerCase();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'colorToXyz',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as ColorChannels;
+  }
+  let xyz;
+  if (value.startsWith('color(')) {
+    [, ...xyz] = parseColorFunc(value, opt) as ComputedColorChannels;
+  } else {
+    [, ...xyz] = parseColorValue(value, opt) as ComputedColorChannels;
+  }
+  setCache(cacheKey, xyz);
+  return xyz as ColorChannels;
+};
+
+/**
+ * convert color to xyz-d50
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns ColorChannels - [x, y, z, alpha]
+ */
+export const colorToXyzD50 = (
+  value: string,
+  opt: Options = {}
+): ColorChannels => {
+  opt.d50 = true;
+  return colorToXyz(value, opt);
+};
+
+/* convert */
+export const convert = {
+  colorToHex,
+  colorToHsl,
+  colorToHwb,
+  colorToLab,
+  colorToLch,
+  colorToOklab,
+  colorToOklch,
+  colorToRgb,
+  colorToXyz,
+  colorToXyzD50,
+  numberToHex
+};

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/css-calc.ts

@@ -0,0 +1,965 @@
+/**
+ * css-calc
+ */
+
+import { calc } from '@csstools/css-calc';
+import { CSSToken, TokenType, tokenize } from '@csstools/css-tokenizer';
+import {
+  CacheItem,
+  NullObject,
+  createCacheKey,
+  getCache,
+  setCache
+} from './cache';
+import { isString, isStringOrNumber } from './common';
+import { resolveVar } from './css-var';
+import { roundToPrecision } from './util';
+import { MatchedRegExp, Options } from './typedef';
+
+/* constants */
+import {
+  ANGLE,
+  LENGTH,
+  NUM,
+  SYN_FN_CALC,
+  SYN_FN_MATH_START,
+  SYN_FN_VAR,
+  SYN_FN_VAR_START,
+  VAL_SPEC
+} from './constant';
+const {
+  CloseParen: PAREN_CLOSE,
+  Comment: COMMENT,
+  Dimension: DIM,
+  EOF,
+  Function: FUNC,
+  OpenParen: PAREN_OPEN,
+  Whitespace: W_SPACE
+} = TokenType;
+const NAMESPACE = 'css-calc';
+
+/* numeric constants */
+const TRIA = 3;
+const HEX = 16;
+const MAX_PCT = 100;
+
+/* regexp */
+const REG_FN_CALC = new RegExp(SYN_FN_CALC);
+const REG_FN_CALC_NUM = new RegExp(`^calc\\((${NUM})\\)$`);
+const REG_FN_MATH_START = new RegExp(SYN_FN_MATH_START);
+const REG_FN_VAR = new RegExp(SYN_FN_VAR);
+const REG_FN_VAR_START = new RegExp(SYN_FN_VAR_START);
+const REG_OPERATOR = /\s[*+/-]\s/;
+const REG_TYPE_DIM = new RegExp(`^(${NUM})(${ANGLE}|${LENGTH})$`);
+const REG_TYPE_DIM_PCT = new RegExp(`^(${NUM})(${ANGLE}|${LENGTH}|%)$`);
+const REG_TYPE_PCT = new RegExp(`^(${NUM})%$`);
+
+/**
+ * Calclator
+ */
+export class Calculator {
+  /* private */
+  // number
+  #hasNum: boolean;
+  #numSum: number[];
+  #numMul: number[];
+  // percentage
+  #hasPct: boolean;
+  #pctSum: number[];
+  #pctMul: number[];
+  // dimension
+  #hasDim: boolean;
+  #dimSum: string[];
+  #dimSub: string[];
+  #dimMul: string[];
+  #dimDiv: string[];
+  // et cetra
+  #hasEtc: boolean;
+  #etcSum: string[];
+  #etcSub: string[];
+  #etcMul: string[];
+  #etcDiv: string[];
+
+  /**
+   * constructor
+   */
+  constructor() {
+    // number
+    this.#hasNum = false;
+    this.#numSum = [];
+    this.#numMul = [];
+    // percentage
+    this.#hasPct = false;
+    this.#pctSum = [];
+    this.#pctMul = [];
+    // dimension
+    this.#hasDim = false;
+    this.#dimSum = [];
+    this.#dimSub = [];
+    this.#dimMul = [];
+    this.#dimDiv = [];
+    // et cetra
+    this.#hasEtc = false;
+    this.#etcSum = [];
+    this.#etcSub = [];
+    this.#etcMul = [];
+    this.#etcDiv = [];
+  }
+
+  get hasNum() {
+    return this.#hasNum;
+  }
+
+  set hasNum(value: boolean) {
+    this.#hasNum = !!value;
+  }
+
+  get numSum() {
+    return this.#numSum;
+  }
+
+  get numMul() {
+    return this.#numMul;
+  }
+
+  get hasPct() {
+    return this.#hasPct;
+  }
+
+  set hasPct(value: boolean) {
+    this.#hasPct = !!value;
+  }
+
+  get pctSum() {
+    return this.#pctSum;
+  }
+
+  get pctMul() {
+    return this.#pctMul;
+  }
+
+  get hasDim() {
+    return this.#hasDim;
+  }
+
+  set hasDim(value: boolean) {
+    this.#hasDim = !!value;
+  }
+
+  get dimSum() {
+    return this.#dimSum;
+  }
+
+  get dimSub() {
+    return this.#dimSub;
+  }
+
+  get dimMul() {
+    return this.#dimMul;
+  }
+
+  get dimDiv() {
+    return this.#dimDiv;
+  }
+
+  get hasEtc() {
+    return this.#hasEtc;
+  }
+
+  set hasEtc(value: boolean) {
+    this.#hasEtc = !!value;
+  }
+
+  get etcSum() {
+    return this.#etcSum;
+  }
+
+  get etcSub() {
+    return this.#etcSub;
+  }
+
+  get etcMul() {
+    return this.#etcMul;
+  }
+
+  get etcDiv() {
+    return this.#etcDiv;
+  }
+
+  /**
+   * clear values
+   * @returns void
+   */
+  clear() {
+    // number
+    this.#hasNum = false;
+    this.#numSum = [];
+    this.#numMul = [];
+    // percentage
+    this.#hasPct = false;
+    this.#pctSum = [];
+    this.#pctMul = [];
+    // dimension
+    this.#hasDim = false;
+    this.#dimSum = [];
+    this.#dimSub = [];
+    this.#dimMul = [];
+    this.#dimDiv = [];
+    // et cetra
+    this.#hasEtc = false;
+    this.#etcSum = [];
+    this.#etcSub = [];
+    this.#etcMul = [];
+    this.#etcDiv = [];
+  }
+
+  /**
+   * sort values
+   * @param values - values
+   * @returns sorted values
+   */
+  sort(values: string[] = []): string[] {
+    const arr = [...values];
+    if (arr.length > 1) {
+      arr.sort((a, b) => {
+        let res;
+        if (REG_TYPE_DIM_PCT.test(a) && REG_TYPE_DIM_PCT.test(b)) {
+          const [, valA, unitA] = a.match(REG_TYPE_DIM_PCT) as MatchedRegExp;
+          const [, valB, unitB] = b.match(REG_TYPE_DIM_PCT) as MatchedRegExp;
+          if (unitA === unitB) {
+            if (Number(valA) === Number(valB)) {
+              res = 0;
+            } else if (Number(valA) > Number(valB)) {
+              res = 1;
+            } else {
+              res = -1;
+            }
+          } else if (unitA > unitB) {
+            res = 1;
+          } else {
+            res = -1;
+          }
+        } else {
+          if (a === b) {
+            res = 0;
+          } else if (a > b) {
+            res = 1;
+          } else {
+            res = -1;
+          }
+        }
+        return res;
+      });
+    }
+    return arr;
+  }
+
+  /**
+   * multiply values
+   * @returns resolved value
+   */
+  multiply(): string {
+    const value = [];
+    let num;
+    if (this.#hasNum) {
+      num = 1;
+      for (const i of this.#numMul) {
+        num *= i;
+        if (num === 0 || !Number.isFinite(num) || Number.isNaN(num)) {
+          break;
+        }
+      }
+      if (!this.#hasPct && !this.#hasDim && !this.hasEtc) {
+        if (Number.isFinite(num)) {
+          num = roundToPrecision(num, HEX);
+        }
+        value.push(num);
+      }
+    }
+    if (this.#hasPct) {
+      if (typeof num !== 'number') {
+        num = 1;
+      }
+      for (const i of this.#pctMul) {
+        num *= i;
+        if (num === 0 || !Number.isFinite(num) || Number.isNaN(num)) {
+          break;
+        }
+      }
+      if (Number.isFinite(num)) {
+        num = `${roundToPrecision(num, HEX)}%`;
+      }
+      if (!this.#hasDim && !this.hasEtc) {
+        value.push(num);
+      }
+    }
+    if (this.#hasDim) {
+      let dim = '';
+      let mul = '';
+      let div = '';
+      if (this.#dimMul.length) {
+        if (this.#dimMul.length === 1) {
+          [mul] = this.#dimMul as [string];
+        } else {
+          mul = `${this.sort(this.#dimMul).join(' * ')}`;
+        }
+      }
+      if (this.#dimDiv.length) {
+        if (this.#dimDiv.length === 1) {
+          [div] = this.#dimDiv as [string];
+        } else {
+          div = `${this.sort(this.#dimDiv).join(' * ')}`;
+        }
+      }
+      if (Number.isFinite(num)) {
+        if (mul) {
+          if (div) {
+            if (div.includes('*')) {
+              dim = calc(`calc(${num} * ${mul} / (${div}))`, {
+                toCanonicalUnits: true
+              });
+            } else {
+              dim = calc(`calc(${num} * ${mul} / ${div})`, {
+                toCanonicalUnits: true
+              });
+            }
+          } else {
+            dim = calc(`calc(${num} * ${mul})`, {
+              toCanonicalUnits: true
+            });
+          }
+        } else if (div.includes('*')) {
+          dim = calc(`calc(${num} / (${div}))`, {
+            toCanonicalUnits: true
+          });
+        } else {
+          dim = calc(`calc(${num} / ${div})`, {
+            toCanonicalUnits: true
+          });
+        }
+        value.push(dim.replace(/^calc/, ''));
+      } else {
+        if (!value.length && num !== undefined) {
+          value.push(num);
+        }
+        if (mul) {
+          if (div) {
+            if (div.includes('*')) {
+              dim = calc(`calc(${mul} / (${div}))`, {
+                toCanonicalUnits: true
+              });
+            } else {
+              dim = calc(`calc(${mul} / ${div})`, {
+                toCanonicalUnits: true
+              });
+            }
+          } else {
+            dim = calc(`calc(${mul})`, {
+              toCanonicalUnits: true
+            });
+          }
+          if (value.length) {
+            value.push('*', dim.replace(/^calc/, ''));
+          } else {
+            value.push(dim.replace(/^calc/, ''));
+          }
+        } else {
+          dim = calc(`calc(${div})`, {
+            toCanonicalUnits: true
+          });
+          if (value.length) {
+            value.push('/', dim.replace(/^calc/, ''));
+          } else {
+            value.push('1', '/', dim.replace(/^calc/, ''));
+          }
+        }
+      }
+    }
+    if (this.#hasEtc) {
+      if (this.#etcMul.length) {
+        if (!value.length && num !== undefined) {
+          value.push(num);
+        }
+        const mul = this.sort(this.#etcMul).join(' * ');
+        if (value.length) {
+          value.push(`* ${mul}`);
+        } else {
+          value.push(`${mul}`);
+        }
+      }
+      if (this.#etcDiv.length) {
+        const div = this.sort(this.#etcDiv).join(' * ');
+        if (div.includes('*')) {
+          if (value.length) {
+            value.push(`/ (${div})`);
+          } else {
+            value.push(`1 / (${div})`);
+          }
+        } else if (value.length) {
+          value.push(`/ ${div}`);
+        } else {
+          value.push(`1 / ${div}`);
+        }
+      }
+    }
+    if (value.length) {
+      return value.join(' ');
+    }
+    return '';
+  }
+
+  /**
+   * sum values
+   * @returns resolved value
+   */
+  sum(): string {
+    const value = [];
+    if (this.#hasNum) {
+      let num = 0;
+      for (const i of this.#numSum) {
+        num += i;
+        if (!Number.isFinite(num) || Number.isNaN(num)) {
+          break;
+        }
+      }
+      value.push(num);
+    }
+    if (this.#hasPct) {
+      let num: number | string = 0;
+      for (const i of this.#pctSum) {
+        num += i;
+        if (!Number.isFinite(num)) {
+          break;
+        }
+      }
+      if (Number.isFinite(num)) {
+        num = `${num}%`;
+      }
+      if (value.length) {
+        value.push(`+ ${num}`);
+      } else {
+        value.push(num);
+      }
+    }
+    if (this.#hasDim) {
+      let dim, sum, sub;
+      if (this.#dimSum.length) {
+        sum = this.sort(this.#dimSum).join(' + ');
+      }
+      if (this.#dimSub.length) {
+        sub = this.sort(this.#dimSub).join(' + ');
+      }
+      if (sum) {
+        if (sub) {
+          if (sub.includes('-')) {
+            dim = calc(`calc(${sum} - (${sub}))`, {
+              toCanonicalUnits: true
+            });
+          } else {
+            dim = calc(`calc(${sum} - ${sub})`, {
+              toCanonicalUnits: true
+            });
+          }
+        } else {
+          dim = calc(`calc(${sum})`, {
+            toCanonicalUnits: true
+          });
+        }
+      } else {
+        dim = calc(`calc(-1 * (${sub}))`, {
+          toCanonicalUnits: true
+        });
+      }
+      if (value.length) {
+        value.push('+', dim.replace(/^calc/, ''));
+      } else {
+        value.push(dim.replace(/^calc/, ''));
+      }
+    }
+    if (this.#hasEtc) {
+      if (this.#etcSum.length) {
+        const sum = this.sort(this.#etcSum)
+          .map(item => {
+            let res;
+            if (
+              REG_OPERATOR.test(item) &&
+              !item.startsWith('(') &&
+              !item.endsWith(')')
+            ) {
+              res = `(${item})`;
+            } else {
+              res = item;
+            }
+            return res;
+          })
+          .join(' + ');
+        if (value.length) {
+          if (this.#etcSum.length > 1) {
+            value.push(`+ (${sum})`);
+          } else {
+            value.push(`+ ${sum}`);
+          }
+        } else {
+          value.push(`${sum}`);
+        }
+      }
+      if (this.#etcSub.length) {
+        const sub = this.sort(this.#etcSub)
+          .map(item => {
+            let res;
+            if (
+              REG_OPERATOR.test(item) &&
+              !item.startsWith('(') &&
+              !item.endsWith(')')
+            ) {
+              res = `(${item})`;
+            } else {
+              res = item;
+            }
+            return res;
+          })
+          .join(' + ');
+        if (value.length) {
+          if (this.#etcSub.length > 1) {
+            value.push(`- (${sub})`);
+          } else {
+            value.push(`- ${sub}`);
+          }
+        } else if (this.#etcSub.length > 1) {
+          value.push(`-1 * (${sub})`);
+        } else {
+          value.push(`-1 * ${sub}`);
+        }
+      }
+    }
+    if (value.length) {
+      return value.join(' ');
+    }
+    return '';
+  }
+}
+
+/**
+ * sort calc values
+ * @param values - values to sort
+ * @param [finalize] - finalize values
+ * @returns sorted values
+ */
+export const sortCalcValues = (
+  values: (number | string)[] = [],
+  finalize: boolean = false
+): string => {
+  if (values.length < TRIA) {
+    throw new Error(`Unexpected array length ${values.length}.`);
+  }
+  const start = values.shift();
+  if (!isString(start) || !start.endsWith('(')) {
+    throw new Error(`Unexpected token ${start}.`);
+  }
+  const end = values.pop();
+  if (end !== ')') {
+    throw new Error(`Unexpected token ${end}.`);
+  }
+  if (values.length === 1) {
+    const [value] = values;
+    if (!isStringOrNumber(value)) {
+      throw new Error(`Unexpected token ${value}.`);
+    }
+    return `${start}${value}${end}`;
+  }
+  const sortedValues = [];
+  const cal = new Calculator();
+  let operator: string = '';
+  const l = values.length;
+  for (let i = 0; i < l; i++) {
+    const value = values[i];
+    if (!isStringOrNumber(value)) {
+      throw new Error(`Unexpected token ${value}.`);
+    }
+    if (value === '*' || value === '/') {
+      operator = value;
+    } else if (value === '+' || value === '-') {
+      const sortedValue = cal.multiply();
+      if (sortedValue) {
+        sortedValues.push(sortedValue, value);
+      }
+      cal.clear();
+      operator = '';
+    } else {
+      const numValue = Number(value);
+      const strValue = `${value}`;
+      switch (operator) {
+        case '/': {
+          if (Number.isFinite(numValue)) {
+            cal.hasNum = true;
+            cal.numMul.push(1 / numValue);
+          } else if (REG_TYPE_PCT.test(strValue)) {
+            const [, val] = strValue.match(REG_TYPE_PCT) as MatchedRegExp;
+            cal.hasPct = true;
+            cal.pctMul.push((MAX_PCT * MAX_PCT) / Number(val));
+          } else if (REG_TYPE_DIM.test(strValue)) {
+            cal.hasDim = true;
+            cal.dimDiv.push(strValue);
+          } else {
+            cal.hasEtc = true;
+            cal.etcDiv.push(strValue);
+          }
+          break;
+        }
+        case '*':
+        default: {
+          if (Number.isFinite(numValue)) {
+            cal.hasNum = true;
+            cal.numMul.push(numValue);
+          } else if (REG_TYPE_PCT.test(strValue)) {
+            const [, val] = strValue.match(REG_TYPE_PCT) as MatchedRegExp;
+            cal.hasPct = true;
+            cal.pctMul.push(Number(val));
+          } else if (REG_TYPE_DIM.test(strValue)) {
+            cal.hasDim = true;
+            cal.dimMul.push(strValue);
+          } else {
+            cal.hasEtc = true;
+            cal.etcMul.push(strValue);
+          }
+        }
+      }
+    }
+    if (i === l - 1) {
+      const sortedValue = cal.multiply();
+      if (sortedValue) {
+        sortedValues.push(sortedValue);
+      }
+      cal.clear();
+      operator = '';
+    }
+  }
+  let resolvedValue = '';
+  if (finalize && (sortedValues.includes('+') || sortedValues.includes('-'))) {
+    const finalizedValues = [];
+    cal.clear();
+    operator = '';
+    const l = sortedValues.length;
+    for (let i = 0; i < l; i++) {
+      const value = sortedValues[i];
+      if (isStringOrNumber(value)) {
+        if (value === '+' || value === '-') {
+          operator = value;
+        } else {
+          const numValue = Number(value);
+          const strValue = `${value}`;
+          switch (operator) {
+            case '-': {
+              if (Number.isFinite(numValue)) {
+                cal.hasNum = true;
+                cal.numSum.push(-1 * numValue);
+              } else if (REG_TYPE_PCT.test(strValue)) {
+                const [, val] = strValue.match(REG_TYPE_PCT) as MatchedRegExp;
+                cal.hasPct = true;
+                cal.pctSum.push(-1 * Number(val));
+              } else if (REG_TYPE_DIM.test(strValue)) {
+                cal.hasDim = true;
+                cal.dimSub.push(strValue);
+              } else {
+                cal.hasEtc = true;
+                cal.etcSub.push(strValue);
+              }
+              break;
+            }
+            case '+':
+            default: {
+              if (Number.isFinite(numValue)) {
+                cal.hasNum = true;
+                cal.numSum.push(numValue);
+              } else if (REG_TYPE_PCT.test(strValue)) {
+                const [, val] = strValue.match(REG_TYPE_PCT) as MatchedRegExp;
+                cal.hasPct = true;
+                cal.pctSum.push(Number(val));
+              } else if (REG_TYPE_DIM.test(strValue)) {
+                cal.hasDim = true;
+                cal.dimSum.push(strValue);
+              } else {
+                cal.hasEtc = true;
+                cal.etcSum.push(strValue);
+              }
+            }
+          }
+        }
+      }
+      if (i === l - 1) {
+        const sortedValue = cal.sum();
+        if (sortedValue) {
+          finalizedValues.push(sortedValue);
+        }
+        cal.clear();
+        operator = '';
+      }
+    }
+    resolvedValue = finalizedValues.join(' ').replace(/\+\s-/g, '- ');
+  } else {
+    resolvedValue = sortedValues.join(' ').replace(/\+\s-/g, '- ');
+  }
+  if (
+    resolvedValue.startsWith('(') &&
+    resolvedValue.endsWith(')') &&
+    resolvedValue.lastIndexOf('(') === 0 &&
+    resolvedValue.indexOf(')') === resolvedValue.length - 1
+  ) {
+    resolvedValue = resolvedValue.replace(/^\(/, '').replace(/\)$/, '');
+  }
+  return `${start}${resolvedValue}${end}`;
+};
+
+/**
+ * serialize calc
+ * @param value - CSS value
+ * @param [opt] - options
+ * @returns serialized value
+ */
+export const serializeCalc = (value: string, opt: Options = {}): string => {
+  const { format = '' } = opt;
+  if (isString(value)) {
+    if (!REG_FN_VAR_START.test(value) || format !== VAL_SPEC) {
+      return value;
+    }
+    value = value.toLowerCase().trim();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'serializeCalc',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as string;
+  }
+  const items: string[] = tokenize({ css: value })
+    .map((token: CSSToken): string => {
+      const [type, value] = token as [TokenType, string];
+      let res = '';
+      if (type !== W_SPACE && type !== COMMENT) {
+        res = value;
+      }
+      return res;
+    })
+    .filter(v => v);
+  let startIndex = items.findLastIndex((item: string) => /\($/.test(item));
+  while (startIndex) {
+    const endIndex = items.findIndex((item: unknown, index: number) => {
+      return item === ')' && index > startIndex;
+    });
+    const slicedValues: string[] = items.slice(startIndex, endIndex + 1);
+    let serializedValue: string = sortCalcValues(slicedValues);
+    if (REG_FN_VAR_START.test(serializedValue)) {
+      serializedValue = calc(serializedValue, {
+        toCanonicalUnits: true
+      });
+    }
+    items.splice(startIndex, endIndex - startIndex + 1, serializedValue);
+    startIndex = items.findLastIndex((item: string) => /\($/.test(item));
+  }
+  const serializedCalc = sortCalcValues(items, true);
+  setCache(cacheKey, serializedCalc);
+  return serializedCalc;
+};
+
+/**
+ * resolve dimension
+ * @param token - CSS token
+ * @param [opt] - options
+ * @returns resolved value
+ */
+export const resolveDimension = (
+  token: CSSToken,
+  opt: Options = {}
+): string | NullObject => {
+  if (!Array.isArray(token)) {
+    throw new TypeError(`${token} is not an array.`);
+  }
+  const [, , , , detail = {}] = token;
+  const { unit, value } = detail as {
+    unit: string;
+    value: number;
+  };
+  const { dimension = {} } = opt;
+  if (unit === 'px') {
+    return `${value}${unit}`;
+  }
+  const relativeValue = Number(value);
+  if (unit && Number.isFinite(relativeValue)) {
+    let pixelValue;
+    if (Object.hasOwnProperty.call(dimension, unit)) {
+      pixelValue = dimension[unit];
+    } else if (typeof dimension.callback === 'function') {
+      pixelValue = dimension.callback(unit);
+    }
+    pixelValue = Number(pixelValue);
+    if (Number.isFinite(pixelValue)) {
+      return `${relativeValue * pixelValue}px`;
+    }
+  }
+  return new NullObject();
+};
+
+/**
+ * parse tokens
+ * @param tokens - CSS tokens
+ * @param [opt] - options
+ * @returns parsed tokens
+ */
+export const parseTokens = (
+  tokens: CSSToken[],
+  opt: Options = {}
+): string[] => {
+  if (!Array.isArray(tokens)) {
+    throw new TypeError(`${tokens} is not an array.`);
+  }
+  const { format = '' } = opt;
+  const mathFunc = new Set();
+  let nest = 0;
+  const res: string[] = [];
+  while (tokens.length) {
+    const token = tokens.shift();
+    if (!Array.isArray(token)) {
+      throw new TypeError(`${token} is not an array.`);
+    }
+    const [type = '', value = ''] = token as [TokenType, string];
+    switch (type) {
+      case DIM: {
+        if (format === VAL_SPEC && !mathFunc.has(nest)) {
+          res.push(value);
+        } else {
+          const resolvedValue = resolveDimension(token, opt);
+          if (isString(resolvedValue)) {
+            res.push(resolvedValue);
+          } else {
+            res.push(value);
+          }
+        }
+        break;
+      }
+      case FUNC:
+      case PAREN_OPEN: {
+        res.push(value);
+        nest++;
+        if (REG_FN_MATH_START.test(value)) {
+          mathFunc.add(nest);
+        }
+        break;
+      }
+      case PAREN_CLOSE: {
+        if (res.length) {
+          const lastValue = res[res.length - 1];
+          if (lastValue === ' ') {
+            res.splice(-1, 1, value);
+          } else {
+            res.push(value);
+          }
+        } else {
+          res.push(value);
+        }
+        if (mathFunc.has(nest)) {
+          mathFunc.delete(nest);
+        }
+        nest--;
+        break;
+      }
+      case W_SPACE: {
+        if (res.length) {
+          const lastValue = res[res.length - 1];
+          if (
+            isString(lastValue) &&
+            !lastValue.endsWith('(') &&
+            lastValue !== ' '
+          ) {
+            res.push(value);
+          }
+        }
+        break;
+      }
+      default: {
+        if (type !== COMMENT && type !== EOF) {
+          res.push(value);
+        }
+      }
+    }
+  }
+  return res;
+};
+
+/**
+ * CSS calc()
+ * @param value - CSS value including calc()
+ * @param [opt] - options
+ * @returns resolved value
+ */
+export const cssCalc = (value: string, opt: Options = {}): string => {
+  const { format = '' } = opt;
+  if (isString(value)) {
+    if (REG_FN_VAR.test(value)) {
+      if (format === VAL_SPEC) {
+        return value;
+      } else {
+        const resolvedValue = resolveVar(value, opt);
+        if (isString(resolvedValue)) {
+          return resolvedValue;
+        } else {
+          return '';
+        }
+      }
+    } else if (!REG_FN_CALC.test(value)) {
+      return value;
+    }
+    value = value.toLowerCase().trim();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'cssCalc',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as string;
+  }
+  const tokens = tokenize({ css: value });
+  const values = parseTokens(tokens, opt);
+  let resolvedValue: string = calc(values.join(''), {
+    toCanonicalUnits: true
+  });
+  if (REG_FN_VAR_START.test(value)) {
+    if (REG_TYPE_DIM_PCT.test(resolvedValue)) {
+      const [, val, unit] = resolvedValue.match(
+        REG_TYPE_DIM_PCT
+      ) as MatchedRegExp;
+      resolvedValue = `${roundToPrecision(Number(val), HEX)}${unit}`;
+    }
+    // wrap with `calc()`
+    if (
+      resolvedValue &&
+      !REG_FN_VAR_START.test(resolvedValue) &&
+      format === VAL_SPEC
+    ) {
+      resolvedValue = `calc(${resolvedValue})`;
+    }
+  }
+  if (format === VAL_SPEC) {
+    if (/\s[-+*/]\s/.test(resolvedValue) && !resolvedValue.includes('NaN')) {
+      resolvedValue = serializeCalc(resolvedValue, opt);
+    } else if (REG_FN_CALC_NUM.test(resolvedValue)) {
+      const [, val] = resolvedValue.match(REG_FN_CALC_NUM) as MatchedRegExp;
+      resolvedValue = `calc(${roundToPrecision(Number(val), HEX)})`;
+    }
+  }
+  setCache(cacheKey, resolvedValue);
+  return resolvedValue;
+};

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/css-gradient.ts

@@ -0,0 +1,289 @@
+/**
+ * css-gradient
+ */
+
+import { CacheItem, createCacheKey, getCache, setCache } from './cache';
+import { isString } from './common';
+import { MatchedRegExp, Options } from './typedef';
+import { isColor, splitValue } from './util';
+
+/* constants */
+import {
+  ANGLE,
+  CS_HUE,
+  CS_RECT,
+  LENGTH,
+  NUM,
+  NUM_POSITIVE,
+  PCT
+} from './constant';
+const NAMESPACE = 'css-gradient';
+const DIM_ANGLE = `${NUM}(?:${ANGLE})`;
+const DIM_ANGLE_PCT = `${DIM_ANGLE}|${PCT}`;
+const DIM_LEN = `${NUM}(?:${LENGTH})|0`;
+const DIM_LEN_PCT = `${DIM_LEN}|${PCT}`;
+const DIM_LEN_PCT_POSI = `${NUM_POSITIVE}(?:${LENGTH}|%)|0`;
+const DIM_LEN_POSI = `${NUM_POSITIVE}(?:${LENGTH})|0`;
+const CTR = 'center';
+const L_R = 'left|right';
+const T_B = 'top|bottom';
+const S_E = 'start|end';
+const AXIS_X = `${L_R}|x-(?:${S_E})`;
+const AXIS_Y = `${T_B}|y-(?:${S_E})`;
+const BLOCK = `block-(?:${S_E})`;
+const INLINE = `inline-(?:${S_E})`;
+const POS_1 = `${CTR}|${AXIS_X}|${AXIS_Y}|${BLOCK}|${INLINE}|${DIM_LEN_PCT}`;
+const POS_2 = [
+  `(?:${CTR}|${AXIS_X})\\s+(?:${CTR}|${AXIS_Y})`,
+  `(?:${CTR}|${AXIS_Y})\\s+(?:${CTR}|${AXIS_X})`,
+  `(?:${CTR}|${AXIS_X}|${DIM_LEN_PCT})\\s+(?:${CTR}|${AXIS_Y}|${DIM_LEN_PCT})`,
+  `(?:${CTR}|${BLOCK})\\s+(?:${CTR}|${INLINE})`,
+  `(?:${CTR}|${INLINE})\\s+(?:${CTR}|${BLOCK})`,
+  `(?:${CTR}|${S_E})\\s+(?:${CTR}|${S_E})`
+].join('|');
+const POS_4 = [
+  `(?:${AXIS_X})\\s+(?:${DIM_LEN_PCT})\\s+(?:${AXIS_Y})\\s+(?:${DIM_LEN_PCT})`,
+  `(?:${AXIS_Y})\\s+(?:${DIM_LEN_PCT})\\s+(?:${AXIS_X})\\s+(?:${DIM_LEN_PCT})`,
+  `(?:${BLOCK})\\s+(?:${DIM_LEN_PCT})\\s+(?:${INLINE})\\s+(?:${DIM_LEN_PCT})`,
+  `(?:${INLINE})\\s+(?:${DIM_LEN_PCT})\\s+(?:${BLOCK})\\s+(?:${DIM_LEN_PCT})`,
+  `(?:${S_E})\\s+(?:${DIM_LEN_PCT})\\s+(?:${S_E})\\s+(?:${DIM_LEN_PCT})`
+].join('|');
+const RAD_EXTENT = '(?:clos|farth)est-(?:corner|side)';
+const RAD_SIZE = [
+  `${RAD_EXTENT}(?:\\s+${RAD_EXTENT})?`,
+  `${DIM_LEN_POSI}`,
+  `(?:${DIM_LEN_PCT_POSI})\\s+(?:${DIM_LEN_PCT_POSI})`
+].join('|');
+const RAD_SHAPE = 'circle|ellipse';
+const FROM_ANGLE = `from\\s+${DIM_ANGLE}`;
+const AT_POSITION = `at\\s+(?:${POS_1}|${POS_2}|${POS_4})`;
+const TO_SIDE_CORNER = `to\\s+(?:(?:${L_R})(?:\\s(?:${T_B}))?|(?:${T_B})(?:\\s(?:${L_R}))?)`;
+const IN_COLOR_SPACE = `in\\s+(?:${CS_RECT}|${CS_HUE})`;
+
+/* type definitions */
+/**
+ * @type ColorStopList - list of color stops
+ */
+type ColorStopList = [string, string, ...string[]];
+
+/**
+ * @typedef Gradient - parsed CSS gradient
+ * @property value - input value
+ * @property type - gradient type
+ * @property [gradientLine] - gradient line
+ * @property colorStopList - list of color stops
+ */
+interface Gradient {
+  value: string;
+  type: string;
+  gradientLine?: string;
+  colorStopList: ColorStopList;
+}
+
+/* regexp */
+const REG_GRAD = /^(?:repeating-)?(?:conic|linear|radial)-gradient\(/;
+const REG_GRAD_CAPT = /^((?:repeating-)?(?:conic|linear|radial)-gradient)\(/;
+
+/**
+ * get gradient type
+ * @param value - gradient value
+ * @returns gradient type
+ */
+export const getGradientType = (value: string): string => {
+  if (isString(value)) {
+    value = value.trim();
+    if (REG_GRAD.test(value)) {
+      const [, type] = value.match(REG_GRAD_CAPT) as MatchedRegExp;
+      return type;
+    }
+  }
+  return '';
+};
+
+/**
+ * validate gradient line
+ * @param value - gradient line value
+ * @param type - gradient type
+ * @returns result
+ */
+export const validateGradientLine = (value: string, type: string): boolean => {
+  if (isString(value) && isString(type)) {
+    value = value.trim();
+    type = type.trim();
+    let lineSyntax = '';
+    if (/^(?:repeating-)?linear-gradient$/.test(type)) {
+      /*
+       * <linear-gradient-line> = [
+       *   [ <angle> | to <side-or-corner> ] ||
+       *   <color-interpolation-method>
+       * ]
+       */
+      lineSyntax = [
+        `(?:${DIM_ANGLE}|${TO_SIDE_CORNER})(?:\\s+${IN_COLOR_SPACE})?`,
+        `${IN_COLOR_SPACE}(?:\\s+(?:${DIM_ANGLE}|${TO_SIDE_CORNER}))?`
+      ].join('|');
+    } else if (/^(?:repeating-)?radial-gradient$/.test(type)) {
+      /*
+       * <radial-gradient-line> = [
+       *   [ [ <radial-shape> || <radial-size> ]? [ at <position> ]? ] ||
+       *   <color-interpolation-method>]?
+       */
+      lineSyntax = [
+        `(?:${RAD_SHAPE})(?:\\s+(?:${RAD_SIZE}))?(?:\\s+${AT_POSITION})?(?:\\s+${IN_COLOR_SPACE})?`,
+        `(?:${RAD_SIZE})(?:\\s+(?:${RAD_SHAPE}))?(?:\\s+${AT_POSITION})?(?:\\s+${IN_COLOR_SPACE})?`,
+        `${AT_POSITION}(?:\\s+${IN_COLOR_SPACE})?`,
+        `${IN_COLOR_SPACE}(?:\\s+${RAD_SHAPE})(?:\\s+(?:${RAD_SIZE}))?(?:\\s+${AT_POSITION})?`,
+        `${IN_COLOR_SPACE}(?:\\s+${RAD_SIZE})(?:\\s+(?:${RAD_SHAPE}))?(?:\\s+${AT_POSITION})?`,
+        `${IN_COLOR_SPACE}(?:\\s+${AT_POSITION})?`
+      ].join('|');
+    } else if (/^(?:repeating-)?conic-gradient$/.test(type)) {
+      /*
+       * <conic-gradient-line> = [
+       *   [ [ from <angle> ]? [ at <position> ]? ] ||
+       *   <color-interpolation-method>
+       * ]
+       */
+      lineSyntax = [
+        `${FROM_ANGLE}(?:\\s+${AT_POSITION})?(?:\\s+${IN_COLOR_SPACE})?`,
+        `${AT_POSITION}(?:\\s+${IN_COLOR_SPACE})?`,
+        `${IN_COLOR_SPACE}(?:\\s+${FROM_ANGLE})?(?:\\s+${AT_POSITION})?`
+      ].join('|');
+    }
+    if (lineSyntax) {
+      const reg = new RegExp(`^(?:${lineSyntax})$`);
+      return reg.test(value);
+    }
+  }
+  return false;
+};
+
+/**
+ * validate color stop list
+ * @param list
+ * @param type
+ * @param [opt]
+ * @returns result
+ */
+export const validateColorStopList = (
+  list: string[],
+  type: string,
+  opt: Options = {}
+): boolean => {
+  if (Array.isArray(list) && list.length > 1) {
+    const dimension = /^(?:repeating-)?conic-gradient$/.test(type)
+      ? DIM_ANGLE_PCT
+      : DIM_LEN_PCT;
+    const regColorHint = new RegExp(`^(?:${dimension})$`);
+    const regDimension = new RegExp(`(?:\\s+(?:${dimension})){1,2}$`);
+    const arr = [];
+    for (const item of list) {
+      if (isString(item)) {
+        if (regColorHint.test(item)) {
+          arr.push('hint');
+        } else {
+          const color = item.replace(regDimension, '');
+          if (isColor(color, opt)) {
+            arr.push('color');
+          } else {
+            return false;
+          }
+        }
+      }
+    }
+    const value = arr.join(',');
+    return /^color(?:,(?:hint,)?color)+$/.test(value);
+  }
+  return false;
+};
+
+/**
+ * parse CSS gradient
+ * @param value - gradient value
+ * @param [opt] - options
+ * @returns parsed result
+ */
+export const parseGradient = (
+  value: string,
+  opt: Options = {}
+): Gradient | null => {
+  if (isString(value)) {
+    value = value.trim();
+    const cacheKey: string = createCacheKey(
+      {
+        namespace: NAMESPACE,
+        name: 'parseGradient',
+        value
+      },
+      opt
+    );
+    const cachedResult = getCache(cacheKey);
+    if (cachedResult instanceof CacheItem) {
+      if (cachedResult.isNull) {
+        return null;
+      }
+      return cachedResult.item as Gradient;
+    }
+    const type = getGradientType(value);
+    const gradValue = value.replace(REG_GRAD, '').replace(/\)$/, '');
+    if (type && gradValue) {
+      const [lineOrColorStop = '', ...colorStops] = splitValue(gradValue, {
+        delimiter: ','
+      });
+      const dimension = /^(?:repeating-)?conic-gradient$/.test(type)
+        ? DIM_ANGLE_PCT
+        : DIM_LEN_PCT;
+      const regDimension = new RegExp(`(?:\\s+(?:${dimension})){1,2}$`);
+      let isColorStop = false;
+      if (regDimension.test(lineOrColorStop)) {
+        const colorStop = lineOrColorStop.replace(regDimension, '');
+        if (isColor(colorStop, opt)) {
+          isColorStop = true;
+        }
+      } else if (isColor(lineOrColorStop, opt)) {
+        isColorStop = true;
+      }
+      if (isColorStop) {
+        colorStops.unshift(lineOrColorStop);
+        const valid = validateColorStopList(colorStops, type, opt);
+        if (valid) {
+          const res: Gradient = {
+            value,
+            type,
+            colorStopList: colorStops as ColorStopList
+          };
+          setCache(cacheKey, res);
+          return res;
+        }
+      } else if (colorStops.length > 1) {
+        const gradientLine = lineOrColorStop;
+        const valid =
+          validateGradientLine(gradientLine, type) &&
+          validateColorStopList(colorStops, type, opt);
+        if (valid) {
+          const res: Gradient = {
+            value,
+            type,
+            gradientLine,
+            colorStopList: colorStops as ColorStopList
+          };
+          setCache(cacheKey, res);
+          return res;
+        }
+      }
+    }
+    setCache(cacheKey, null);
+    return null;
+  }
+  return null;
+};
+
+/**
+ * is CSS gradient
+ * @param value - CSS value
+ * @param [opt] - options
+ * @returns result
+ */
+export const isGradient = (value: string, opt: Options = {}): boolean => {
+  const gradient = parseGradient(value, opt);
+  return gradient !== null;
+};

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/css-var.ts

@@ -0,0 +1,250 @@
+/**
+ * css-var
+ */
+
+import { CSSToken, TokenType, tokenize } from '@csstools/css-tokenizer';
+import {
+  CacheItem,
+  NullObject,
+  createCacheKey,
+  getCache,
+  setCache
+} from './cache';
+import { isString } from './common';
+import { cssCalc } from './css-calc';
+import { isColor } from './util';
+import { Options } from './typedef';
+
+/* constants */
+import { FN_VAR, SYN_FN_CALC, SYN_FN_VAR, VAL_SPEC } from './constant';
+const {
+  CloseParen: PAREN_CLOSE,
+  Comment: COMMENT,
+  EOF,
+  Ident: IDENT,
+  Whitespace: W_SPACE
+} = TokenType;
+const NAMESPACE = 'css-var';
+
+/* regexp */
+const REG_FN_CALC = new RegExp(SYN_FN_CALC);
+const REG_FN_VAR = new RegExp(SYN_FN_VAR);
+
+/**
+ * resolve custom property
+ * @param tokens - CSS tokens
+ * @param [opt] - options
+ * @returns result - [tokens, resolvedValue]
+ */
+export function resolveCustomProperty(
+  tokens: CSSToken[],
+  opt: Options = {}
+): [CSSToken[], string] {
+  if (!Array.isArray(tokens)) {
+    throw new TypeError(`${tokens} is not an array.`);
+  }
+  const { customProperty = {} } = opt;
+  const items: string[] = [];
+  while (tokens.length) {
+    const token = tokens.shift();
+    if (!Array.isArray(token)) {
+      throw new TypeError(`${token} is not an array.`);
+    }
+    const [type, value] = token as [TokenType, string];
+    // end of var()
+    if (type === PAREN_CLOSE) {
+      break;
+    }
+    // nested var()
+    if (value === FN_VAR) {
+      const [restTokens, item] = resolveCustomProperty(tokens, opt);
+      tokens = restTokens;
+      if (item) {
+        items.push(item);
+      }
+    } else if (type === IDENT) {
+      if (value.startsWith('--')) {
+        let item;
+        if (Object.hasOwnProperty.call(customProperty, value)) {
+          item = customProperty[value] as string;
+        } else if (typeof customProperty.callback === 'function') {
+          item = customProperty.callback(value);
+        }
+        if (item) {
+          items.push(item);
+        }
+      } else if (value) {
+        items.push(value);
+      }
+    }
+  }
+  let resolveAsColor = false;
+  if (items.length > 1) {
+    const lastValue = items[items.length - 1];
+    resolveAsColor = isColor(lastValue);
+  }
+  let resolvedValue = '';
+  for (let item of items) {
+    item = item.trim();
+    if (REG_FN_VAR.test(item)) {
+      // recurse resolveVar()
+      const resolvedItem = resolveVar(item, opt);
+      if (isString(resolvedItem)) {
+        if (resolveAsColor) {
+          if (isColor(resolvedItem)) {
+            resolvedValue = resolvedItem;
+          }
+        } else {
+          resolvedValue = resolvedItem;
+        }
+      }
+    } else if (REG_FN_CALC.test(item)) {
+      item = cssCalc(item, opt);
+      if (resolveAsColor) {
+        if (isColor(item)) {
+          resolvedValue = item;
+        }
+      } else {
+        resolvedValue = item;
+      }
+    } else if (
+      item &&
+      !/^(?:inherit|initial|revert(?:-layer)?|unset)$/.test(item)
+    ) {
+      if (resolveAsColor) {
+        if (isColor(item)) {
+          resolvedValue = item;
+        }
+      } else {
+        resolvedValue = item;
+      }
+    }
+    if (resolvedValue) {
+      break;
+    }
+  }
+  return [tokens, resolvedValue];
+}
+
+/**
+ * parse tokens
+ * @param tokens - CSS tokens
+ * @param [opt] - options
+ * @returns parsed tokens
+ */
+export function parseTokens(
+  tokens: CSSToken[],
+  opt: Options = {}
+): string[] | NullObject {
+  const res: string[] = [];
+  while (tokens.length) {
+    const token = tokens.shift();
+    const [type = '', value = ''] = token as [TokenType, string];
+    if (value === FN_VAR) {
+      const [restTokens, resolvedValue] = resolveCustomProperty(tokens, opt);
+      if (!resolvedValue) {
+        return new NullObject();
+      }
+      tokens = restTokens;
+      res.push(resolvedValue);
+    } else {
+      switch (type) {
+        case PAREN_CLOSE: {
+          if (res.length) {
+            const lastValue = res[res.length - 1];
+            if (lastValue === ' ') {
+              res.splice(-1, 1, value);
+            } else {
+              res.push(value);
+            }
+          } else {
+            res.push(value);
+          }
+          break;
+        }
+        case W_SPACE: {
+          if (res.length) {
+            const lastValue = res[res.length - 1];
+            if (
+              isString(lastValue) &&
+              !lastValue.endsWith('(') &&
+              lastValue !== ' '
+            ) {
+              res.push(value);
+            }
+          }
+          break;
+        }
+        default: {
+          if (type !== COMMENT && type !== EOF) {
+            res.push(value);
+          }
+        }
+      }
+    }
+  }
+  return res;
+}
+
+/**
+ * resolve CSS var()
+ * @param value - CSS value including var()
+ * @param [opt] - options
+ * @returns resolved value
+ */
+export function resolveVar(
+  value: string,
+  opt: Options = {}
+): string | NullObject {
+  const { format = '' } = opt;
+  if (isString(value)) {
+    if (!REG_FN_VAR.test(value) || format === VAL_SPEC) {
+      return value;
+    }
+    value = value.trim();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'resolveVar',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    if (cachedResult.isNull) {
+      return cachedResult as NullObject;
+    }
+    return cachedResult.item as string;
+  }
+  const tokens = tokenize({ css: value });
+  const values = parseTokens(tokens, opt);
+  if (Array.isArray(values)) {
+    let color = values.join('');
+    if (REG_FN_CALC.test(color)) {
+      color = cssCalc(color, opt);
+    }
+    setCache(cacheKey, color);
+    return color;
+  } else {
+    setCache(cacheKey, null);
+    return new NullObject();
+  }
+}
+
+/**
+ * CSS var()
+ * @param value - CSS value including var()
+ * @param [opt] - options
+ * @returns resolved value
+ */
+export const cssVar = (value: string, opt: Options = {}): string => {
+  const resolvedValue = resolveVar(value, opt);
+  if (isString(resolvedValue)) {
+    return resolvedValue;
+  }
+  return '';
+};

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/relative-color.ts

@@ -0,0 +1,580 @@
+/**
+ * relative-color
+ */
+
+import { SyntaxFlag, color as colorParser } from '@csstools/css-color-parser';
+import {
+  ComponentValue,
+  parseComponentValue
+} from '@csstools/css-parser-algorithms';
+import { CSSToken, TokenType, tokenize } from '@csstools/css-tokenizer';
+import {
+  CacheItem,
+  NullObject,
+  createCacheKey,
+  getCache,
+  setCache
+} from './cache';
+import { NAMED_COLORS, convertColorToRgb } from './color';
+import { isString, isStringOrNumber } from './common';
+import { resolveDimension, serializeCalc } from './css-calc';
+import { resolveColor } from './resolve';
+import { roundToPrecision } from './util';
+import {
+  ColorChannels,
+  MatchedRegExp,
+  Options,
+  StringColorChannels
+} from './typedef';
+
+/* constants */
+import {
+  CS_LAB,
+  CS_LCH,
+  FN_REL,
+  FN_REL_CAPT,
+  FN_VAR,
+  NONE,
+  SYN_COLOR_TYPE,
+  SYN_FN_MATH_START,
+  SYN_FN_VAR,
+  SYN_MIX,
+  VAL_SPEC
+} from './constant';
+const {
+  CloseParen: PAREN_CLOSE,
+  Comment: COMMENT,
+  Dimension: DIM,
+  EOF,
+  Function: FUNC,
+  Ident: IDENT,
+  Number: NUM,
+  OpenParen: PAREN_OPEN,
+  Percentage: PCT,
+  Whitespace: W_SPACE
+} = TokenType;
+const { HasNoneKeywords: KEY_NONE } = SyntaxFlag;
+const NAMESPACE = 'relative-color';
+
+/* numeric constants */
+const OCT = 8;
+const DEC = 10;
+const HEX = 16;
+const MAX_PCT = 100;
+const MAX_RGB = 255;
+
+/* type definitions */
+/**
+ * @type NumberOrStringColorChannels - color channel
+ */
+type NumberOrStringColorChannels = ColorChannels & StringColorChannels;
+
+/* regexp */
+const REG_COLOR_CAPT = new RegExp(
+  `^${FN_REL}(${SYN_COLOR_TYPE}|${SYN_MIX})\\s+`
+);
+const REG_CS_HSL = /(?:hsla?|hwb)$/;
+const REG_CS_CIE = new RegExp(`^(?:${CS_LAB}|${CS_LCH})$`);
+const REG_FN_MATH_START = new RegExp(SYN_FN_MATH_START);
+const REG_FN_REL = new RegExp(FN_REL);
+const REG_FN_REL_CAPT = new RegExp(`^${FN_REL_CAPT}`);
+const REG_FN_REL_START = new RegExp(`^${FN_REL}`);
+const REG_FN_VAR = new RegExp(SYN_FN_VAR);
+
+/**
+ * resolve relative color channels
+ * @param tokens - CSS tokens
+ * @param [opt] - options
+ * @returns resolved color channels
+ */
+export function resolveColorChannels(
+  tokens: CSSToken[],
+  opt: Options = {}
+): NumberOrStringColorChannels | NullObject {
+  if (!Array.isArray(tokens)) {
+    throw new TypeError(`${tokens} is not an array.`);
+  }
+  const { colorSpace = '', format = '' } = opt;
+  const colorChannels = new Map([
+    ['color', ['r', 'g', 'b', 'alpha']],
+    ['hsl', ['h', 's', 'l', 'alpha']],
+    ['hsla', ['h', 's', 'l', 'alpha']],
+    ['hwb', ['h', 'w', 'b', 'alpha']],
+    ['lab', ['l', 'a', 'b', 'alpha']],
+    ['lch', ['l', 'c', 'h', 'alpha']],
+    ['oklab', ['l', 'a', 'b', 'alpha']],
+    ['oklch', ['l', 'c', 'h', 'alpha']],
+    ['rgb', ['r', 'g', 'b', 'alpha']],
+    ['rgba', ['r', 'g', 'b', 'alpha']]
+  ]);
+  const colorChannel = colorChannels.get(colorSpace);
+  // invalid color channel
+  if (!colorChannel) {
+    return new NullObject();
+  }
+  const mathFunc = new Set();
+  const channels: [
+    (number | string)[],
+    (number | string)[],
+    (number | string)[],
+    (number | string)[]
+  ] = [[], [], [], []];
+  let i = 0;
+  let nest = 0;
+  let func = false;
+  while (tokens.length) {
+    const token = tokens.shift();
+    if (!Array.isArray(token)) {
+      throw new TypeError(`${token} is not an array.`);
+    }
+    const [type, value, , , detail] = token as [
+      TokenType,
+      string,
+      number,
+      number,
+      { value: string | number } | undefined
+    ];
+    const channel = channels[i];
+    if (Array.isArray(channel)) {
+      switch (type) {
+        case DIM: {
+          const resolvedValue = resolveDimension(token, opt);
+          if (isString(resolvedValue)) {
+            channel.push(resolvedValue);
+          } else {
+            channel.push(value);
+          }
+          break;
+        }
+        case FUNC: {
+          channel.push(value);
+          func = true;
+          nest++;
+          if (REG_FN_MATH_START.test(value)) {
+            mathFunc.add(nest);
+          }
+          break;
+        }
+        case IDENT: {
+          // invalid channel key
+          if (!colorChannel.includes(value)) {
+            return new NullObject();
+          }
+          channel.push(value);
+          if (!func) {
+            i++;
+          }
+          break;
+        }
+        case NUM: {
+          channel.push(Number(detail?.value));
+          if (!func) {
+            i++;
+          }
+          break;
+        }
+        case PAREN_OPEN: {
+          channel.push(value);
+          nest++;
+          break;
+        }
+        case PAREN_CLOSE: {
+          if (func) {
+            const lastValue = channel[channel.length - 1];
+            if (lastValue === ' ') {
+              channel.splice(-1, 1, value);
+            } else {
+              channel.push(value);
+            }
+            if (mathFunc.has(nest)) {
+              mathFunc.delete(nest);
+            }
+            nest--;
+            if (nest === 0) {
+              func = false;
+              i++;
+            }
+          }
+          break;
+        }
+        case PCT: {
+          channel.push(Number(detail?.value) / MAX_PCT);
+          if (!func) {
+            i++;
+          }
+          break;
+        }
+        case W_SPACE: {
+          if (channel.length && func) {
+            const lastValue = channel[channel.length - 1];
+            if (typeof lastValue === 'number') {
+              channel.push(value);
+            } else if (
+              isString(lastValue) &&
+              !lastValue.endsWith('(') &&
+              lastValue !== ' '
+            ) {
+              channel.push(value);
+            }
+          }
+          break;
+        }
+        default: {
+          if (type !== COMMENT && type !== EOF && func) {
+            channel.push(value);
+          }
+        }
+      }
+    }
+  }
+  const channelValues = [];
+  for (const channel of channels) {
+    if (channel.length === 1) {
+      const [resolvedValue] = channel;
+      if (isStringOrNumber(resolvedValue)) {
+        channelValues.push(resolvedValue);
+      }
+    } else if (channel.length) {
+      const resolvedValue = serializeCalc(channel.join(''), {
+        format
+      });
+      channelValues.push(resolvedValue);
+    }
+  }
+  return channelValues as NumberOrStringColorChannels;
+}
+
+/**
+ * extract origin color
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns origin color value
+ */
+export function extractOriginColor(
+  value: string,
+  opt: Options = {}
+): string | NullObject {
+  const { currentColor = '', format = '' } = opt;
+  if (isString(value)) {
+    value = value.toLowerCase().trim();
+    if (!value) {
+      return new NullObject();
+    }
+    if (!REG_FN_REL_START.test(value)) {
+      return value;
+    }
+  } else {
+    return new NullObject();
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'extractOriginColor',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    if (cachedResult.isNull) {
+      return cachedResult as NullObject;
+    }
+    return cachedResult.item as string;
+  }
+  if (/currentcolor/.test(value)) {
+    if (currentColor) {
+      value = value.replace(/currentcolor/g, currentColor);
+    } else {
+      setCache(cacheKey, null);
+      return new NullObject();
+    }
+  }
+  let colorSpace = '';
+  if (REG_FN_REL_CAPT.test(value)) {
+    [, colorSpace] = value.match(REG_FN_REL_CAPT) as MatchedRegExp;
+  }
+  opt.colorSpace = colorSpace;
+  if (REG_COLOR_CAPT.test(value)) {
+    const [, originColor] = value.match(REG_COLOR_CAPT) as MatchedRegExp;
+    const [, restValue] = value.split(originColor) as MatchedRegExp;
+    if (/^[a-z]+$/.test(originColor)) {
+      if (
+        !/^transparent$/.test(originColor) &&
+        !Object.prototype.hasOwnProperty.call(NAMED_COLORS, originColor)
+      ) {
+        setCache(cacheKey, null);
+        return new NullObject();
+      }
+    } else if (format === VAL_SPEC) {
+      const resolvedOriginColor = resolveColor(originColor, opt);
+      if (isString(resolvedOriginColor)) {
+        value = value.replace(originColor, resolvedOriginColor);
+      }
+    }
+    if (format === VAL_SPEC) {
+      const tokens = tokenize({ css: restValue });
+      const channelValues = resolveColorChannels(tokens, opt);
+      if (channelValues instanceof NullObject) {
+        setCache(cacheKey, null);
+        return channelValues;
+      }
+      const [v1, v2, v3, v4] = channelValues;
+      let channelValue = '';
+      if (isStringOrNumber(v4)) {
+        channelValue = ` ${v1} ${v2} ${v3} / ${v4})`;
+      } else {
+        channelValue = ` ${channelValues.join(' ')})`;
+      }
+      if (restValue !== channelValue) {
+        value = value.replace(restValue, channelValue);
+      }
+    }
+    // nested relative color
+  } else {
+    const [, restValue] = value.split(REG_FN_REL_START) as MatchedRegExp;
+    const tokens = tokenize({ css: restValue });
+    const originColor: string[] = [];
+    let nest = 0;
+    while (tokens.length) {
+      const [type, tokenValue] = tokens.shift() as [TokenType, string];
+      switch (type) {
+        case FUNC:
+        case PAREN_OPEN: {
+          originColor.push(tokenValue);
+          nest++;
+          break;
+        }
+        case PAREN_CLOSE: {
+          const lastValue = originColor[originColor.length - 1];
+          if (lastValue === ' ') {
+            originColor.splice(-1, 1, tokenValue);
+          } else if (isString(lastValue)) {
+            originColor.push(tokenValue);
+          }
+          nest--;
+          break;
+        }
+        case W_SPACE: {
+          const lastValue = originColor[originColor.length - 1];
+          if (
+            isString(lastValue) &&
+            !lastValue.endsWith('(') &&
+            lastValue !== ' '
+          ) {
+            originColor.push(tokenValue);
+          }
+          break;
+        }
+        default: {
+          if (type !== COMMENT && type !== EOF) {
+            originColor.push(tokenValue);
+          }
+        }
+      }
+      if (nest === 0) {
+        break;
+      }
+    }
+    const resolvedOriginColor = resolveRelativeColor(
+      originColor.join('').trim(),
+      opt
+    );
+    if (resolvedOriginColor instanceof NullObject) {
+      setCache(cacheKey, null);
+      return resolvedOriginColor;
+    }
+    const channelValues = resolveColorChannels(tokens, opt);
+    if (channelValues instanceof NullObject) {
+      setCache(cacheKey, null);
+      return channelValues;
+    }
+    const [v1, v2, v3, v4] = channelValues;
+    let channelValue = '';
+    if (isStringOrNumber(v4)) {
+      channelValue = ` ${v1} ${v2} ${v3} / ${v4})`;
+    } else {
+      channelValue = ` ${channelValues.join(' ')})`;
+    }
+    value = value.replace(restValue, `${resolvedOriginColor}${channelValue}`);
+  }
+  setCache(cacheKey, value);
+  return value;
+}
+
+/**
+ * resolve relative color
+ * @param value - CSS relative color value
+ * @param [opt] - options
+ * @returns resolved value
+ */
+export function resolveRelativeColor(
+  value: string,
+  opt: Options = {}
+): string | NullObject {
+  const { format = '' } = opt;
+  if (isString(value)) {
+    if (REG_FN_VAR.test(value)) {
+      if (format === VAL_SPEC) {
+        return value;
+        // var() must be resolved before resolveRelativeColor()
+      } else {
+        throw new SyntaxError(`Unexpected token ${FN_VAR} found.`);
+      }
+    } else if (!REG_FN_REL.test(value)) {
+      return value;
+    }
+    value = value.toLowerCase().trim();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'resolveRelativeColor',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    if (cachedResult.isNull) {
+      return cachedResult as NullObject;
+    }
+    return cachedResult.item as string;
+  }
+  const originColor = extractOriginColor(value, opt);
+  if (originColor instanceof NullObject) {
+    setCache(cacheKey, null);
+    return originColor;
+  }
+  value = originColor;
+  if (format === VAL_SPEC) {
+    if (value.startsWith('rgba(')) {
+      value = value.replace(/^rgba\(/, 'rgb(');
+    } else if (value.startsWith('hsla(')) {
+      value = value.replace(/^hsla\(/, 'hsl(');
+    }
+    return value;
+  }
+  const tokens = tokenize({ css: value });
+  const components = parseComponentValue(tokens) as ComponentValue;
+  const parsedComponents = colorParser(components);
+  if (!parsedComponents) {
+    setCache(cacheKey, null);
+    return new NullObject();
+  }
+  const {
+    alpha: alphaComponent,
+    channels: channelsComponent,
+    colorNotation,
+    syntaxFlags
+  } = parsedComponents;
+  let alpha: number | string;
+  if (Number.isNaN(Number(alphaComponent))) {
+    if (syntaxFlags instanceof Set && syntaxFlags.has(KEY_NONE)) {
+      alpha = NONE;
+    } else {
+      alpha = 0;
+    }
+  } else {
+    alpha = roundToPrecision(Number(alphaComponent), OCT);
+  }
+  let v1: number | string;
+  let v2: number | string;
+  let v3: number | string;
+  [v1, v2, v3] = channelsComponent;
+  let resolvedValue;
+  if (REG_CS_CIE.test(colorNotation)) {
+    const hasNone = syntaxFlags instanceof Set && syntaxFlags.has(KEY_NONE);
+    if (Number.isNaN(v1)) {
+      if (hasNone) {
+        v1 = NONE;
+      } else {
+        v1 = 0;
+      }
+    } else {
+      v1 = roundToPrecision(v1, HEX);
+    }
+    if (Number.isNaN(v2)) {
+      if (hasNone) {
+        v2 = NONE;
+      } else {
+        v2 = 0;
+      }
+    } else {
+      v2 = roundToPrecision(v2, HEX);
+    }
+    if (Number.isNaN(v3)) {
+      if (hasNone) {
+        v3 = NONE;
+      } else {
+        v3 = 0;
+      }
+    } else {
+      v3 = roundToPrecision(v3, HEX);
+    }
+    if (alpha === 1) {
+      resolvedValue = `${colorNotation}(${v1} ${v2} ${v3})`;
+    } else {
+      resolvedValue = `${colorNotation}(${v1} ${v2} ${v3} / ${alpha})`;
+    }
+  } else if (REG_CS_HSL.test(colorNotation)) {
+    if (Number.isNaN(v1)) {
+      v1 = 0;
+    }
+    if (Number.isNaN(v2)) {
+      v2 = 0;
+    }
+    if (Number.isNaN(v3)) {
+      v3 = 0;
+    }
+    let [r, g, b] = convertColorToRgb(
+      `${colorNotation}(${v1} ${v2} ${v3} / ${alpha})`
+    ) as ColorChannels;
+    r = roundToPrecision(r / MAX_RGB, DEC);
+    g = roundToPrecision(g / MAX_RGB, DEC);
+    b = roundToPrecision(b / MAX_RGB, DEC);
+    if (alpha === 1) {
+      resolvedValue = `color(srgb ${r} ${g} ${b})`;
+    } else {
+      resolvedValue = `color(srgb ${r} ${g} ${b} / ${alpha})`;
+    }
+  } else {
+    const cs = colorNotation === 'rgb' ? 'srgb' : colorNotation;
+    const hasNone = syntaxFlags instanceof Set && syntaxFlags.has(KEY_NONE);
+    if (Number.isNaN(v1)) {
+      if (hasNone) {
+        v1 = NONE;
+      } else {
+        v1 = 0;
+      }
+    } else {
+      v1 = roundToPrecision(v1, DEC);
+    }
+    if (Number.isNaN(v2)) {
+      if (hasNone) {
+        v2 = NONE;
+      } else {
+        v2 = 0;
+      }
+    } else {
+      v2 = roundToPrecision(v2, DEC);
+    }
+    if (Number.isNaN(v3)) {
+      if (hasNone) {
+        v3 = NONE;
+      } else {
+        v3 = 0;
+      }
+    } else {
+      v3 = roundToPrecision(v3, DEC);
+    }
+    if (alpha === 1) {
+      resolvedValue = `color(${cs} ${v1} ${v2} ${v3})`;
+    } else {
+      resolvedValue = `color(${cs} ${v1} ${v2} ${v3} / ${alpha})`;
+    }
+  }
+  setCache(cacheKey, resolvedValue);
+  return resolvedValue;
+}

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/resolve.ts

@@ -0,0 +1,379 @@
+/**
+ * resolve
+ */
+
+import {
+  CacheItem,
+  NullObject,
+  createCacheKey,
+  getCache,
+  setCache
+} from './cache';
+import {
+  convertRgbToHex,
+  resolveColorFunc,
+  resolveColorMix,
+  resolveColorValue
+} from './color';
+import { isString } from './common';
+import { cssCalc } from './css-calc';
+import { resolveVar } from './css-var';
+import { resolveRelativeColor } from './relative-color';
+import {
+  ComputedColorChannels,
+  Options,
+  SpecifiedColorChannels
+} from './typedef';
+
+/* constants */
+import {
+  FN_COLOR,
+  FN_MIX,
+  SYN_FN_CALC,
+  SYN_FN_REL,
+  SYN_FN_VAR,
+  VAL_COMP,
+  VAL_SPEC
+} from './constant';
+const NAMESPACE = 'resolve';
+const RGB_TRANSPARENT = 'rgba(0, 0, 0, 0)';
+
+/* regexp */
+const REG_FN_CALC = new RegExp(SYN_FN_CALC);
+const REG_FN_REL = new RegExp(SYN_FN_REL);
+const REG_FN_VAR = new RegExp(SYN_FN_VAR);
+
+/**
+ * resolve color
+ * @param value - CSS color value
+ * @param [opt] - options
+ * @returns resolved color
+ */
+export const resolveColor = (
+  value: string,
+  opt: Options = {}
+): string | NullObject => {
+  if (isString(value)) {
+    value = value.trim();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const { currentColor = '', format = VAL_COMP, nullable = false } = opt;
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'resolve',
+      value
+    },
+    opt
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    if (cachedResult.isNull) {
+      return cachedResult as NullObject;
+    }
+    return cachedResult.item as string;
+  }
+  if (REG_FN_VAR.test(value)) {
+    if (format === VAL_SPEC) {
+      setCache(cacheKey, value);
+      return value;
+    }
+    const resolvedValue = resolveVar(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      switch (format) {
+        case 'hex':
+        case 'hexAlpha': {
+          setCache(cacheKey, resolvedValue);
+          return resolvedValue;
+        }
+        default: {
+          if (nullable) {
+            setCache(cacheKey, resolvedValue);
+            return resolvedValue;
+          }
+          const res = RGB_TRANSPARENT;
+          setCache(cacheKey, res);
+          return res;
+        }
+      }
+    } else {
+      value = resolvedValue;
+    }
+  }
+  if (opt.format !== format) {
+    opt.format = format;
+  }
+  value = value.toLowerCase();
+  if (REG_FN_REL.test(value)) {
+    const resolvedValue = resolveRelativeColor(value, opt);
+    if (format === VAL_COMP) {
+      let res;
+      if (resolvedValue instanceof NullObject) {
+        if (nullable) {
+          res = resolvedValue;
+        } else {
+          res = RGB_TRANSPARENT;
+        }
+      } else {
+        res = resolvedValue;
+      }
+      setCache(cacheKey, res);
+      return res;
+    }
+    if (format === VAL_SPEC) {
+      let res = '';
+      if (resolvedValue instanceof NullObject) {
+        res = '';
+      } else {
+        res = resolvedValue;
+      }
+      setCache(cacheKey, res);
+      return res;
+    }
+    if (resolvedValue instanceof NullObject) {
+      value = '';
+    } else {
+      value = resolvedValue;
+    }
+  }
+  if (REG_FN_CALC.test(value)) {
+    value = cssCalc(value, opt);
+  }
+  let cs = '';
+  let r = NaN;
+  let g = NaN;
+  let b = NaN;
+  let alpha = NaN;
+  if (value === 'transparent') {
+    switch (format) {
+      case VAL_SPEC: {
+        setCache(cacheKey, value);
+        return value;
+      }
+      case 'hex': {
+        setCache(cacheKey, null);
+        return new NullObject();
+      }
+      case 'hexAlpha': {
+        const res = '#00000000';
+        setCache(cacheKey, res);
+        return res;
+      }
+      case VAL_COMP:
+      default: {
+        const res = RGB_TRANSPARENT;
+        setCache(cacheKey, res);
+        return res;
+      }
+    }
+  } else if (value === 'currentcolor') {
+    if (format === VAL_SPEC) {
+      setCache(cacheKey, value);
+      return value;
+    }
+    if (currentColor) {
+      let resolvedValue;
+      if (currentColor.startsWith(FN_MIX)) {
+        resolvedValue = resolveColorMix(currentColor, opt);
+      } else if (currentColor.startsWith(FN_COLOR)) {
+        resolvedValue = resolveColorFunc(currentColor, opt);
+      } else {
+        resolvedValue = resolveColorValue(currentColor, opt);
+      }
+      if (resolvedValue instanceof NullObject) {
+        setCache(cacheKey, resolvedValue);
+        return resolvedValue;
+      }
+      [cs, r, g, b, alpha] = resolvedValue as ComputedColorChannels;
+    } else if (format === VAL_COMP) {
+      const res = RGB_TRANSPARENT;
+      setCache(cacheKey, res);
+      return res;
+    }
+  } else if (format === VAL_SPEC) {
+    if (value.startsWith(FN_MIX)) {
+      const res = resolveColorMix(value, opt) as string;
+      setCache(cacheKey, res);
+      return res;
+    } else if (value.startsWith(FN_COLOR)) {
+      const [scs, rr, gg, bb, aa] = resolveColorFunc(
+        value,
+        opt
+      ) as SpecifiedColorChannels;
+      let res = '';
+      if (aa === 1) {
+        res = `color(${scs} ${rr} ${gg} ${bb})`;
+      } else {
+        res = `color(${scs} ${rr} ${gg} ${bb} / ${aa})`;
+      }
+      setCache(cacheKey, res);
+      return res;
+    } else {
+      const rgb = resolveColorValue(value, opt);
+      if (isString(rgb)) {
+        setCache(cacheKey, rgb);
+        return rgb;
+      }
+      const [scs, rr, gg, bb, aa] = rgb as SpecifiedColorChannels;
+      let res = '';
+      if (scs === 'rgb') {
+        if (aa === 1) {
+          res = `${scs}(${rr}, ${gg}, ${bb})`;
+        } else {
+          res = `${scs}a(${rr}, ${gg}, ${bb}, ${aa})`;
+        }
+      } else if (aa === 1) {
+        res = `${scs}(${rr} ${gg} ${bb})`;
+      } else {
+        res = `${scs}(${rr} ${gg} ${bb} / ${aa})`;
+      }
+      setCache(cacheKey, res);
+      return res;
+    }
+  } else if (value.startsWith(FN_MIX)) {
+    if (/currentcolor/.test(value)) {
+      if (currentColor) {
+        value = value.replace(/currentcolor/g, currentColor);
+      }
+    }
+    if (/transparent/.test(value)) {
+      value = value.replace(/transparent/g, RGB_TRANSPARENT);
+    }
+    const resolvedValue = resolveColorMix(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      setCache(cacheKey, resolvedValue);
+      return resolvedValue;
+    }
+    [cs, r, g, b, alpha] = resolvedValue as ComputedColorChannels;
+  } else if (value.startsWith(FN_COLOR)) {
+    const resolvedValue = resolveColorFunc(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      setCache(cacheKey, resolvedValue);
+      return resolvedValue;
+    }
+    [cs, r, g, b, alpha] = resolvedValue as ComputedColorChannels;
+  } else if (value) {
+    const resolvedValue = resolveColorValue(value, opt);
+    if (resolvedValue instanceof NullObject) {
+      setCache(cacheKey, resolvedValue);
+      return resolvedValue;
+    }
+    [cs, r, g, b, alpha] = resolvedValue as ComputedColorChannels;
+  }
+  let res = '';
+  switch (format) {
+    case 'hex': {
+      if (
+        Number.isNaN(r) ||
+        Number.isNaN(g) ||
+        Number.isNaN(b) ||
+        Number.isNaN(alpha) ||
+        alpha === 0
+      ) {
+        setCache(cacheKey, null);
+        return new NullObject();
+      }
+      res = convertRgbToHex([r, g, b, 1]);
+      break;
+    }
+    case 'hexAlpha': {
+      if (
+        Number.isNaN(r) ||
+        Number.isNaN(g) ||
+        Number.isNaN(b) ||
+        Number.isNaN(alpha)
+      ) {
+        setCache(cacheKey, null);
+        return new NullObject();
+      }
+      res = convertRgbToHex([r, g, b, alpha]);
+      break;
+    }
+    case VAL_COMP:
+    default: {
+      switch (cs) {
+        case 'rgb': {
+          if (alpha === 1) {
+            res = `${cs}(${r}, ${g}, ${b})`;
+          } else {
+            res = `${cs}a(${r}, ${g}, ${b}, ${alpha})`;
+          }
+          break;
+        }
+        case 'lab':
+        case 'lch':
+        case 'oklab':
+        case 'oklch': {
+          if (alpha === 1) {
+            res = `${cs}(${r} ${g} ${b})`;
+          } else {
+            res = `${cs}(${r} ${g} ${b} / ${alpha})`;
+          }
+          break;
+        }
+        // color()
+        default: {
+          if (alpha === 1) {
+            res = `color(${cs} ${r} ${g} ${b})`;
+          } else {
+            res = `color(${cs} ${r} ${g} ${b} / ${alpha})`;
+          }
+        }
+      }
+    }
+  }
+  setCache(cacheKey, res);
+  return res;
+};
+
+/**
+ * resolve CSS color
+ * @param value
+ *   - CSS color value
+ *   - system colors are not supported
+ * @param [opt] - options
+ * @param [opt.currentColor]
+ *   - color to use for `currentcolor` keyword
+ *   - if omitted, it will be treated as a missing color
+ *     i.e. `rgb(none none none / none)`
+ * @param [opt.customProperty]
+ *   - custom properties
+ *   - pair of `--` prefixed property name and value,
+ *     e.g. `customProperty: { '--some-color': '#0000ff' }`
+ *   - and/or `callback` function to get the value of the custom property,
+ *     e.g. `customProperty: { callback: someDeclaration.getPropertyValue }`
+ * @param [opt.dimension]
+ *   - dimension, convert relative length to pixels
+ *   - pair of unit and it's value as a number in pixels,
+ *     e.g. `dimension: { em: 12, rem: 16, vw: 10.26 }`
+ *   - and/or `callback` function to get the value as a number in pixels,
+ *     e.g. `dimension: { callback: convertUnitToPixel }`
+ * @param [opt.format]
+ *   - output format, one of below
+ *   - `computedValue` (default), [computed value][139] of the color
+ *   - `specifiedValue`, [specified value][140] of the color
+ *   - `hex`, hex color notation, i.e. `rrggbb`
+ *   - `hexAlpha`, hex color notation with alpha channel, i.e. `#rrggbbaa`
+ * @returns
+ *   - one of rgba?(), #rrggbb(aa)?, color-name, '(empty-string)',
+ *     color(color-space r g b / alpha), color(color-space x y z / alpha),
+ *     lab(l a b / alpha), lch(l c h / alpha), oklab(l a b / alpha),
+ *     oklch(l c h / alpha), null
+ *   - in `computedValue`, values are numbers, however `rgb()` values are
+ *     integers
+ *   - in `specifiedValue`, returns `empty string` for unknown and/or invalid
+ *     color
+ *   - in `hex`, returns `null` for `transparent`, and also returns `null` if
+ *     any of `r`, `g`, `b`, `alpha` is not a number
+ *   - in `hexAlpha`, returns `#00000000` for `transparent`,
+ *     however returns `null` if any of `r`, `g`, `b`, `alpha` is not a number
+ */
+export const resolve = (value: string, opt: Options = {}): string | null => {
+  opt.nullable = false;
+  const resolvedValue = resolveColor(value, opt);
+  if (resolvedValue instanceof NullObject) {
+    return null;
+  }
+  return resolvedValue as string;
+};

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/typedef.ts

@@ -0,0 +1,87 @@
+/**
+ * typedef
+ */
+
+/* type definitions */
+/**
+ * @typedef Options - options
+ * @property [alpha] - enable alpha
+ * @property [colorSpace] - color space
+ * @property [currentColor] - color for currentcolor
+ * @property [customPropeerty] - custom properties
+ * @property [d50] - white point in d50
+ * @property [dimension] - dimension
+ * @property [format] - output format
+ * @property [key] - key
+ */
+export interface Options {
+  alpha?: boolean;
+  colorSpace?: string;
+  currentColor?: string;
+  customProperty?: Record<string, string | ((K: string) => string)>;
+  d50?: boolean;
+  delimiter?: string | string[];
+  dimension?: Record<string, number | ((K: string) => number)>;
+  format?: string;
+  nullable?: boolean;
+  preserveComment?: boolean;
+}
+
+/**
+ * @type ColorChannels - color channels
+ */
+export type ColorChannels = [x: number, y: number, z: number, alpha: number];
+
+/**
+ * @type StringColorChannels - color channels
+ */
+export type StringColorChannels = [
+  x: string,
+  y: string,
+  z: string,
+  alpha: string | undefined
+];
+
+/**
+ * @type StringColorSpacedChannels - specified value
+ */
+export type StringColorSpacedChannels = [
+  cs: string,
+  x: string,
+  y: string,
+  z: string,
+  alpha: string | undefined
+];
+
+/**
+ * @type ComputedColorChannels - computed value
+ */
+export type ComputedColorChannels = [
+  cs: string,
+  x: number,
+  y: number,
+  z: number,
+  alpha: number
+];
+
+/**
+ * @type SpecifiedColorChannels - specified value
+ */
+export type SpecifiedColorChannels = [
+  cs: string,
+  x: number | string,
+  y: number | string,
+  z: number | string,
+  alpha: number | string
+];
+
+/**
+ * @type MatchedRegExp - matched regexp array
+ */
+export type MatchedRegExp = [
+  match: string,
+  gr1: string,
+  gr2: string,
+  gr3: string,
+  gr4: string
+];

capabilities/testdrive-jsui/node_modules/@asamuzakjp/css-color/src/js/util.ts

@@ -0,0 +1,336 @@
+/**
+ * util
+ */
+
+import { TokenType, tokenize } from '@csstools/css-tokenizer';
+import { CacheItem, createCacheKey, getCache, setCache } from './cache';
+import { isString } from './common';
+import { resolveColor } from './resolve';
+import { Options } from './typedef';
+
+/* constants */
+import { NAMED_COLORS } from './color';
+import { SYN_COLOR_TYPE, SYN_MIX, VAL_SPEC } from './constant';
+const {
+  CloseParen: PAREN_CLOSE,
+  Comma: COMMA,
+  Comment: COMMENT,
+  Delim: DELIM,
+  EOF,
+  Function: FUNC,
+  Ident: IDENT,
+  OpenParen: PAREN_OPEN,
+  Whitespace: W_SPACE
+} = TokenType;
+const NAMESPACE = 'util';
+
+/* numeric constants */
+const DEC = 10;
+const HEX = 16;
+const DEG = 360;
+const DEG_HALF = 180;
+
+/* regexp */
+const REG_COLOR = new RegExp(`^(?:${SYN_COLOR_TYPE})$`);
+const REG_FN_COLOR =
+  /^(?:(?:ok)?l(?:ab|ch)|color(?:-mix)?|hsla?|hwb|rgba?|var)\(/;
+const REG_MIX = new RegExp(SYN_MIX);
+
+/**
+ * split value
+ * NOTE: comments are stripped, it can be preserved if, in the options param,
+ * `delimiter` is either ',' or '/' and with `preserveComment` set to `true`
+ * @param value - CSS value
+ * @param [opt] - options
+ * @returns array of values
+ */
+export const splitValue = (value: string, opt: Options = {}): string[] => {
+  if (isString(value)) {
+    value = value.trim();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const { delimiter = ' ', preserveComment = false } = opt;
+  const cacheKey: string = createCacheKey(
+    {
+      namespace: NAMESPACE,
+      name: 'splitValue',
+      value
+    },
+    {
+      delimiter,
+      preserveComment
+    }
+  );
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as string[];
+  }
+  let regDelimiter;
+  if (delimiter === ',') {
+    regDelimiter = /^,$/;
+  } else if (delimiter === '/') {
+    regDelimiter = /^\/$/;
+  } else {
+    regDelimiter = /^\s+$/;
+  }
+  const tokens = tokenize({ css: value });
+  let nest = 0;
+  let str = '';
+  const res: string[] = [];
+  while (tokens.length) {
+    const [type, value] = tokens.shift() as [TokenType, string];
+    switch (type) {
+      case COMMA: {
+        if (regDelimiter.test(value)) {
+          if (nest === 0) {
+            res.push(str.trim());
+            str = '';
+          } else {
+            str += value;
+          }
+        } else {
+          str += value;
+        }
+        break;
+      }
+      case DELIM: {
+        if (regDelimiter.test(value)) {
+          if (nest === 0) {
+            res.push(str.trim());
+            str = '';
+          } else {
+            str += value;
+          }
+        } else {
+          str += value;
+        }
+        break;
+      }
+      case COMMENT: {
+        if (preserveComment && (delimiter === ',' || delimiter === '/')) {
+          str += value;
+        }
+        break;
+      }
+      case FUNC:
+      case PAREN_OPEN: {
+        str += value;
+        nest++;
+        break;
+      }
+      case PAREN_CLOSE: {
+        str += value;
+        nest--;
+        break;
+      }
+      case W_SPACE: {
+        if (regDelimiter.test(value)) {
+          if (nest === 0) {
+            if (str) {
+              res.push(str.trim());
+              str = '';
+            }
+          } else {
+            str += ' ';
+          }
+        } else if (!str.endsWith(' ')) {
+          str += ' ';
+        }
+        break;
+      }
+      default: {
+        if (type === EOF) {
+          res.push(str.trim());
+          str = '';
+        } else {
+          str += value;
+        }
+      }
+    }
+  }
+  setCache(cacheKey, res);
+  return res;
+};
+
+/**
+ * extract dashed-ident tokens
+ * @param value - CSS value
+ * @returns array of dashed-ident tokens
+ */
+export const extractDashedIdent = (value: string): string[] => {
+  if (isString(value)) {
+    value = value.trim();
+  } else {
+    throw new TypeError(`${value} is not a string.`);
+  }
+  const cacheKey: string = createCacheKey({
+    namespace: NAMESPACE,
+    name: 'extractDashedIdent',
+    value
+  });
+  const cachedResult = getCache(cacheKey);
+  if (cachedResult instanceof CacheItem) {
+    return cachedResult.item as string[];
+  }
+  const tokens = tokenize({ css: value });
+  const items = new Set();
+  while (tokens.length) {
+    const [type, value] = tokens.shift() as [TokenType, string];
+    if (type === IDENT && value.startsWith('--')) {
+      items.add(value);
+    }
+  }
+  const res = [...items] as string[];
+  setCache(cacheKey, res);
+  return res;
+};
+
+/**
+ * is color
+ * @param value - CSS value
+ * @param [opt] - options
+ * @returns result
+ */
+export const isColor = (value: unknown, opt: Options = {}): boolean => {
+  if (isString(value)) {
+    value = value.toLowerCase().trim();
+    if (value && isString(value)) {
+      if (/^[a-z]+$/.test(value)) {
+        if (
+          /^(?:currentcolor|transparent)$/.test(value) ||
+          Object.prototype.hasOwnProperty.call(NAMED_COLORS, value)
+        ) {
+          return true;
+        }
+      } else if (REG_COLOR.test(value) || REG_MIX.test(value)) {
+        return true;
+      } else if (REG_FN_COLOR.test(value)) {
+        opt.nullable = true;
+        if (!opt.format) {
+          opt.format = VAL_SPEC;
+        }
+        const resolvedValue = resolveColor(value, opt);
+        if (resolvedValue) {
+          return true;
+        }
+      }
+    }
+  }
+  return false;
+};
+
+/**
+ * value to JSON string
+ * @param value - CSS value
+ * @param [func] - stringify function
+ * @returns stringified value in JSON notation
+ */
+export const valueToJsonString = (
+  value: unknown,
+  func: boolean = false
+): string => {
+  if (typeof value === 'undefined') {
+    return '';
+  }
+  const res = JSON.stringify(value, (_key, val) => {
+    let replacedValue;
+    if (typeof val === 'undefined') {
+      replacedValue = null;
+    } else if (typeof val === 'function') {
+      if (func) {
+        replacedValue = val.toString().replace(/\s/g, '').substring(0, HEX);
+      } else {
+        replacedValue = val.name;
+      }
+    } else if (val instanceof Map || val instanceof Set) {
+      replacedValue = [...val];
+    } else if (typeof val === 'bigint') {
+      replacedValue = val.toString();
+    } else {
+      replacedValue = val;
+    }
+    return replacedValue;
+  });
+  return res;
+};
+
+/**
+ * round to specified precision
+ * @param value - numeric value
+ * @param bit - minimum bits
+ * @returns rounded value
+ */
+export const roundToPrecision = (value: number, bit: number = 0): number => {
+  if (!Number.isFinite(value)) {
+    throw new TypeError(`${value} is not a finite number.`);
+  }
+  if (!Number.isFinite(bit)) {
+    throw new TypeError(`${bit} is not a finite number.`);
+  } else if (bit < 0 || bit > HEX) {
+    throw new RangeError(`${bit} is not between 0 and ${HEX}.`);
+  }
+  if (bit === 0) {
+    return Math.round(value);
+  }
+  let val;
+  if (bit === HEX) {
+    val = value.toPrecision(6);
+  } else if (bit < DEC) {
+    val = value.toPrecision(4);
+  } else {
+    val = value.toPrecision(5);
+  }
+  return parseFloat(val);
+};
+
+/**
+ * interpolate hue
+ * @param hueA - hue value
+ * @param hueB - hue value
+ * @param arc - shorter | longer | increasing | decreasing
+ * @returns result - [hueA, hueB]
+ */
+export const interpolateHue = (
+  hueA: number,
+  hueB: number,
+  arc: string = 'shorter'
+): [number, number] => {
+  if (!Number.isFinite(hueA)) {
+    throw new TypeError(`${hueA} is not a finite number.`);
+  }
+  if (!Number.isFinite(hueB)) {
+    throw new TypeError(`${hueB} is not a finite number.`);
+  }
+  switch (arc) {
+    case 'decreasing': {
+      if (hueB > hueA) {
+        hueA += DEG;
+      }
+      break;
+    }
+    case 'increasing': {
+      if (hueB < hueA) {
+        hueB += DEG;
+      }
+      break;
+    }
+    case 'longer': {
+      if (hueB > hueA && hueB < hueA + DEG_HALF) {
+        hueA += DEG;
+      } else if (hueB > hueA + DEG_HALF * -1 && hueB <= hueA) {
+        hueB += DEG;
+      }
+      break;
+    }
+    case 'shorter':
+    default: {
+      if (hueB > hueA + DEG_HALF) {
+        hueA += DEG;
+      } else if (hueB < hueA + DEG_HALF * -1) {
+        hueB += DEG;
+      }
+    }
+  }
+  return [hueA, hueB];
+};

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 asamuzaK (Kazz)
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/README.md

@@ -0,0 +1,200 @@
+# DOM Selector
+
+[![build](https://github.com/asamuzaK/domSelector/actions/workflows/node.js.yml/badge.svg)](https://github.com/asamuzaK/domSelector/actions/workflows/node.js.yml)
+[![CodeQL](https://github.com/asamuzaK/domSelector/actions/workflows/codeql.yml/badge.svg)](https://github.com/asamuzaK/domSelector/actions/workflows/codeql.yml)
+[![npm (scoped)](https://img.shields.io/npm/v/@asamuzakjp/dom-selector)](https://www.npmjs.com/package/@asamuzakjp/dom-selector)
+
+A CSS selector engine.
+Used in jsdom since [jsdom v23.2.0](https://github.com/jsdom/jsdom/releases/tag/23.2.0).
+
+## Install
+
+```console
+npm i @asamuzakjp/dom-selector
+```
+
+## Usage
+
+```javascript
+import {
+  matches, closest, querySelector, querySelectorAll
+} from '@asamuzakjp/dom-selector';
+```
+
+<!-- Generated by documentation.js. Update this documentation by updating the source code. -->
+
+### matches(selector, node, opt)
+
+matches - same functionality as [Element.matches()][64]
+
+#### Parameters
+
+- `selector` **[string][59]** CSS selector
+- `node` **[object][60]** Element node
+- `opt` **[object][60]?** options
+  - `opt.warn` **[boolean][61]?** console warn e.g. unsupported pseudo-class
+
+Returns **[boolean][61]** `true` if matched, `false` otherwise
+
+
+### closest(selector, node, opt)
+
+closest - same functionality as [Element.closest()][65]
+
+#### Parameters
+
+- `selector` **[string][59]** CSS selector
+- `node` **[object][60]** Element node
+- `opt` **[object][60]?** options
+  - `opt.warn` **[boolean][61]?** console warn e.g. unsupported pseudo-class
+
+Returns **[object][60]?** matched node
+
+
+### querySelector(selector, node, opt)
+
+querySelector - same functionality as [Document.querySelector()][66], [DocumentFragment.querySelector()][67], [Element.querySelector()][68]
+
+#### Parameters
+
+- `selector` **[string][59]** CSS selector
+- `node` **[object][60]** Document, DocumentFragment or Element node
+- `opt` **[object][60]?** options
+  - `opt.warn` **[boolean][61]?** console warn e.g. unsupported pseudo-class
+
+Returns **[object][60]?** matched node
+
+
+### querySelectorAll(selector, node, opt)
+
+querySelectorAll - same functionality as [Document.querySelectorAll()][69], [DocumentFragment.querySelectorAll()][70], [Element.querySelectorAll()][71]  
+**NOTE**: returns Array, not NodeList
+
+#### Parameters
+
+- `selector` **[string][59]** CSS selector
+- `node` **[object][60]** Document, DocumentFragment or Element node
+- `opt` **[object][60]?** options
+  - `opt.warn` **[boolean][61]?** console warn e.g. unsupported pseudo-class
+
+Returns **[Array][62]&lt;([object][60] \| [undefined][63])>** array of matched nodes
+
+
+## Supported CSS selectors
+
+|Pattern|Supported|Note|
+|:--------|:-------:|:--------|
+|\*|✓| |
+|ns\|E|✓| |
+|\*\|E|✓| |
+|\|E|✓| |
+|E|✓| |
+|E:not(s1, s2, …)|✓| |
+|E:is(s1, s2, …)|✓| |
+|E:where(s1, s2, …)|✓| |
+|E:has(rs1, rs2, …)|✓| |
+|E.warning|✓| |
+|E#myid|✓| |
+|E\[foo\]|✓| |
+|E\[foo="bar"\]|✓| |
+|E\[foo="bar"&nbsp;i\]|✓| |
+|E\[foo="bar"&nbsp;s\]|✓| |
+|E\[foo~="bar"\]|✓| |
+|E\[foo^="bar"\]|✓| |
+|E\[foo$="bar"\]|✓| |
+|E\[foo*="bar"\]|✓| |
+|E\[foo\|="en"\]|✓| |
+|E:defined|Unsupported| |
+|E:dir(ltr)|✓| |
+|E:lang(en)|Partially supported|Comma-separated list of language codes, e.g. `:lang(en, fr)`, is not yet supported.|
+|E:any&#8209;link|✓| |
+|E:link|✓| |
+|E:visited|✓|Returns `false` or `null` to prevent fingerprinting.|
+|E:local&#8209;link|✓| |
+|E:target|✓| |
+|E:target&#8209;within|✓| |
+|E:scope|✓| |
+|E:current|Unsupported| |
+|E:current(s)|Unsupported| |
+|E:past|Unsupported| |
+|E:future|Unsupported| |
+|E:active|Unsupported| |
+|E:hover|Unsupported| |
+|E:focus|✓| |
+|E:focus&#8209;within|✓| |
+|E:focus&#8209;visible|Unsupported| |
+|E:enabled<br>E:disabled|✓| |
+|E:read&#8209;write<br>E:read&#8209;only|✓| |
+|E:placeholder&#8209;shown|✓| |
+|E:default|✓| |
+|E:checked|✓| |
+|E:indeterminate|✓| |
+|E:valid<br>E:invalid|✓| |
+|E:required<br>E:optional|✓| |
+|E:blank|Unsupported| |
+|E:user&#8209;invalid|Unsupported| |
+|E:root|✓| |
+|E:empty|✓| |
+|E:nth&#8209;child(n&nbsp;[of&nbsp;S]?)|✓| |
+|E:nth&#8209;last&#8209;child(n&nbsp;[of&nbsp;S]?)|✓| |
+|E:first&#8209;child|✓| |
+|E:last&#8209;child|✓| |
+|E:only&#8209;child|✓| |
+|E:nth&#8209;of&#8209;type(n)|✓| |
+|E:nth&#8209;last&#8209;of&#8209;type(n)|✓| |
+|E:first&#8209;of&#8209;type|✓| |
+|E:last&#8209;of&#8209;type|✓| |
+|E:only&#8209;of&#8209;type|✓| |
+|E&nbsp;F|✓| |
+|E > F|✓| |
+|E + F|✓| |
+|E ~ F|✓| |
+|F \|\| E|Unsupported| |
+|E:nth&#8209;col(n)|Unsupported| |
+|E:nth&#8209;last&#8209;col(n)|Unsupported| |
+|:host|✓| |
+|:host(s)|✓| |
+|:host&#8209;context(s)|✓| |
+
+
+<!--
+### Performance
+
+TODO: rewrite benchmark table
+-->
+
+
+## Acknowledgments
+
+The following resources have been of great help in the development of the DOM Selector.
+
+- [CSSTree](https://github.com/csstree/csstree)
+- [selery](https://github.com/danburzo/selery)
+- [jsdom](https://github.com/jsdom/jsdom)
+
+
+---
+Copyright (c) 2023 [asamuzaK (Kazz)](https://github.com/asamuzaK/)
+
+
+[1]: #matches
+[2]: #parameters
+[3]: #closest
+[4]: #parameters-1
+[5]: #queryselector
+[6]: #parameters-2
+[7]: #queryselectorall
+[8]: #parameters-3
+[59]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/String
+[60]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Object
+[61]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Boolean
+[62]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/Array
+[63]: https://developer.mozilla.org/docs/Web/JavaScript/Reference/Global_Objects/undefined
+[64]: https://developer.mozilla.org/docs/Web/API/Element/matches
+[65]: https://developer.mozilla.org/docs/Web/API/Element/closest
+[66]: https://developer.mozilla.org/docs/Web/API/Document/querySelector
+[67]: https://developer.mozilla.org/docs/Web/API/DocumentFragment/querySelector
+[68]: https://developer.mozilla.org/docs/Web/API/Element/querySelector
+[69]: https://developer.mozilla.org/docs/Web/API/Document/querySelectorAll
+[70]: https://developer.mozilla.org/docs/Web/API/DocumentFragment/querySelectorAll
+[71]: https://developer.mozilla.org/docs/Web/API/Element/querySelectorAll

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/package.json

@@ -0,0 +1,62 @@
+{
+  "name": "@asamuzakjp/dom-selector",
+  "description": "A CSS selector engine.",
+  "author": "asamuzaK",
+  "license": "MIT",
+  "homepage": "https://github.com/asamuzaK/domSelector#readme",
+  "bugs": {
+    "url": "https://github.com/asamuzaK/domSelector/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/asamuzaK/domSelector.git"
+  },
+  "files": [
+    "dist",
+    "src",
+    "types"
+  ],
+  "type": "module",
+  "exports": {
+    "import": "./src/index.js",
+    "require": "./dist/cjs/index.js"
+  },
+  "types": "types/index.d.ts",
+  "dependencies": {
+    "bidi-js": "^1.0.3",
+    "css-tree": "^2.3.1",
+    "is-potential-custom-element-name": "^1.0.1"
+  },
+  "devDependencies": {
+    "@types/css-tree": "^2.3.4",
+    "benchmark": "^2.1.4",
+    "c8": "^9.0.0",
+    "chai": "^5.0.0",
+    "commander": "^11.1.0",
+    "esbuild": "^0.19.11",
+    "eslint": "^8.56.0",
+    "eslint-config-standard": "^17.1.0",
+    "eslint-plugin-import": "^2.29.1",
+    "eslint-plugin-jsdoc": "^48.0.2",
+    "eslint-plugin-regexp": "^2.1.2",
+    "eslint-plugin-unicorn": "^50.0.1",
+    "happy-dom": "^12.10.3",
+    "jsdom": "^23.1.0",
+    "linkedom": "^0.16.6",
+    "mocha": "^10.2.0",
+    "sinon": "^17.0.1",
+    "typescript": "^5.3.3",
+    "wpt-runner": "^5.0.0"
+  },
+  "scripts": {
+    "bench": "node benchmark/bench.js",
+    "build": "npm run tsc && npm run lint && npm test && npm run compat",
+    "compat": "esbuild --format=cjs --platform=node --outdir=dist/cjs/ --minify --sourcemap src/**/*.js",
+    "lint": "eslint --fix .",
+    "test": "c8 --reporter=text mocha --exit test/**/*.test.js",
+    "test-wpt": "npm run update-wpt && node test/wpt/wpt-runner.js",
+    "tsc": "npx tsc",
+    "update-wpt": "git submodule update --init --recursive --remote"
+  },
+  "version": "2.0.2"
+}

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/src/index.js

@@ -0,0 +1,54 @@
+/*!
+ * DOM Selector - A CSS selector engine.
+ * @license MIT
+ * @copyright asamuzaK (Kazz)
+ * @see {@link https://github.com/asamuzaK/domSelector/blob/main/LICENSE}
+ */
+
+/* import */
+import { Matcher } from './js/matcher.js';
+
+/**
+ * matches
+ * @param {string} selector - CSS selector
+ * @param {object} node - Element node
+ * @param {object} [opt] - options
+ * @param {boolean} [opt.warn] - console warn e.g. unsupported pseudo-class
+ * @returns {boolean} - `true` if matched, `false` otherwise
+ */
+export const matches = (selector, node, opt) =>
+  new Matcher(selector, node, opt).matches();
+
+/**
+ * closest
+ * @param {string} selector - CSS selector
+ * @param {object} node - Element node
+ * @param {object} [opt] - options
+ * @param {boolean} [opt.warn] - console warn e.g. unsupported pseudo-class
+ * @returns {?object} - matched node
+ */
+export const closest = (selector, node, opt) =>
+  new Matcher(selector, node, opt).closest();
+
+/**
+ * querySelector
+ * @param {string} selector - CSS selector
+ * @param {object} node - Document, DocumentFragment or Element node
+ * @param {object} [opt] - options
+ * @param {boolean} [opt.warn] - console warn e.g. unsupported pseudo-class
+ * @returns {?object} - matched node
+ */
+export const querySelector = (selector, node, opt) =>
+  new Matcher(selector, node, opt).querySelector();
+
+/**
+ * querySelectorAll
+ * NOTE: returns Array, not NodeList
+ * @param {string} selector - CSS selector
+ * @param {object} node - Document, DocumentFragment or Element node
+ * @param {object} [opt] - options
+ * @param {boolean} [opt.warn] - console warn e.g. unsupported pseudo-class
+ * @returns {Array.<object|undefined>} - array of matched nodes
+ */
+export const querySelectorAll = (selector, node, opt) =>
+  new Matcher(selector, node, opt).querySelectorAll();

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/src/js/constant.js

@@ -0,0 +1,58 @@
+/**
+ * constant.js
+ */
+
+/* string */
+export const ALPHA_NUM = '[A-Z\\d]+';
+export const AN_PLUS_B = 'AnPlusB';
+export const COMBINATOR = 'Combinator';
+export const IDENTIFIER = 'Identifier';
+export const NOT_SUPPORTED_ERR = 'NotSupportedError';
+export const NTH = 'Nth';
+export const RAW = 'Raw';
+export const SELECTOR = 'Selector';
+export const SELECTOR_ATTR = 'AttributeSelector';
+export const SELECTOR_CLASS = 'ClassSelector';
+export const SELECTOR_ID = 'IdSelector';
+export const SELECTOR_LIST = 'SelectorList';
+export const SELECTOR_PSEUDO_CLASS = 'PseudoClassSelector';
+export const SELECTOR_PSEUDO_ELEMENT = 'PseudoElementSelector';
+export const SELECTOR_TYPE = 'TypeSelector';
+export const STRING = 'String';
+export const SYNTAX_ERR = 'SyntaxError';
+export const U_FFFD = '\uFFFD';
+
+/* numeric */
+export const BIT_01 = 1;
+export const BIT_02 = 2;
+export const BIT_04 = 4;
+export const BIT_08 = 8;
+export const BIT_16 = 0x10;
+export const BIT_32 = 0x20;
+export const BIT_HYPHEN = 0x2D;
+export const DUO = 2;
+export const HEX = 16;
+export const MAX_BIT_16 = 0xFFFF;
+export const TYPE_FROM = 8;
+export const TYPE_TO = -1;
+
+/* Node */
+export const ELEMENT_NODE = 1;
+export const TEXT_NODE = 3;
+export const DOCUMENT_NODE = 9;
+export const DOCUMENT_FRAGMENT_NODE = 11;
+export const DOCUMENT_POSITION_PRECEDING = 2;
+export const DOCUMENT_POSITION_CONTAINS = 8;
+export const DOCUMENT_POSITION_CONTAINED_BY = 0x10;
+
+/* NodeFilter */
+export const SHOW_ALL = 0xffffffff;
+export const SHOW_DOCUMENT = 0x100;
+export const SHOW_DOCUMENT_FRAGMENT = 0x400;
+export const SHOW_ELEMENT = 1;
+
+/* regexp */
+export const REG_LOGICAL_PSEUDO = /^(?:(?:ha|i)s|not|where)$/;
+export const REG_SHADOW_HOST = /^host(?:-context)?$/;
+export const REG_SHADOW_MODE = /^(?:close|open)$/;
+export const REG_SHADOW_PSEUDO = /^part|slotted$/;

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/src/js/dom-util.js

@@ -0,0 +1,294 @@
+/**
+ * dom-util.js
+ */
+
+/* import */
+import bidiFactory from 'bidi-js';
+
+/* constants */
+import {
+  DOCUMENT_FRAGMENT_NODE, DOCUMENT_NODE, DOCUMENT_POSITION_CONTAINS,
+  DOCUMENT_POSITION_CONTAINED_BY, DOCUMENT_POSITION_PRECEDING, ELEMENT_NODE,
+  REG_SHADOW_MODE, SYNTAX_ERR, TEXT_NODE
+} from './constant.js';
+
+/**
+ * is in shadow tree
+ * @param {object} node - node
+ * @returns {boolean} - result;
+ */
+export const isInShadowTree = (node = {}) => {
+  let bool;
+  if (node.nodeType === ELEMENT_NODE ||
+      node.nodeType === DOCUMENT_FRAGMENT_NODE) {
+    let refNode = node;
+    while (refNode) {
+      const { host, mode, nodeType, parentNode } = refNode;
+      if (host && mode && nodeType === DOCUMENT_FRAGMENT_NODE &&
+          REG_SHADOW_MODE.test(mode)) {
+        bool = true;
+        break;
+      }
+      refNode = parentNode;
+    }
+  }
+  return !!bool;
+};
+
+/**
+ * get slotted text content
+ * @param {object} node - Element node
+ * @returns {?string} - text content
+ */
+export const getSlottedTextContent = (node = {}) => {
+  let res;
+  if (node.localName === 'slot' && isInShadowTree(node)) {
+    const nodes = node.assignedNodes();
+    if (nodes.length) {
+      for (const item of nodes) {
+        res = item.textContent.trim();
+        if (res) {
+          break;
+        }
+      }
+    } else {
+      res = node.textContent.trim();
+    }
+  }
+  return res ?? null;
+};
+
+/**
+ * get directionality of node
+ * @see https://html.spec.whatwg.org/multipage/dom.html#the-dir-attribute
+ * @param {object} node - Element node
+ * @returns {?string} - 'ltr' / 'rtl'
+ */
+export const getDirectionality = (node = {}) => {
+  let res;
+  if (node.nodeType === ELEMENT_NODE) {
+    const { dir: nodeDir, localName, parentNode } = node;
+    const { getEmbeddingLevels } = bidiFactory();
+    const regDir = /^(?:ltr|rtl)$/;
+    if (regDir.test(nodeDir)) {
+      res = nodeDir;
+    } else if (nodeDir === 'auto') {
+      let text;
+      switch (localName) {
+        case 'input': {
+          if (!node.type || /^(?:(?:butto|hidde)n|(?:emai|te|ur)l|(?:rese|submi|tex)t|password|search)$/.test(node.type)) {
+            text = node.value;
+          }
+          break;
+        }
+        case 'slot': {
+          text = getSlottedTextContent(node);
+          break;
+        }
+        case 'textarea': {
+          text = node.value;
+          break;
+        }
+        default: {
+          const items = [].slice.call(node.childNodes);
+          for (const item of items) {
+            const {
+              dir: itemDir, localName: itemLocalName, nodeType: itemNodeType,
+              textContent: itemTextContent
+            } = item;
+            if (itemNodeType === TEXT_NODE) {
+              text = itemTextContent.trim();
+            } else if (itemNodeType === ELEMENT_NODE) {
+              if (!/^(?:bdi|s(?:cript|tyle)|textarea)$/.test(itemLocalName) &&
+                  (!itemDir || !regDir.test(itemDir))) {
+                if (itemLocalName === 'slot') {
+                  text = getSlottedTextContent(item);
+                } else {
+                  text = itemTextContent.trim();
+                }
+              }
+            }
+            if (text) {
+              break;
+            }
+          }
+        }
+      }
+      if (text) {
+        const { paragraphs: [{ level }] } = getEmbeddingLevels(text);
+        if (level % 2 === 1) {
+          res = 'rtl';
+        } else {
+          res = 'ltr';
+        }
+      }
+      if (!res) {
+        if (parentNode) {
+          const { nodeType: parentNodeType } = parentNode;
+          if (parentNodeType === ELEMENT_NODE) {
+            res = getDirectionality(parentNode);
+          } else if (parentNodeType === DOCUMENT_NODE ||
+                     parentNodeType === DOCUMENT_FRAGMENT_NODE) {
+            res = 'ltr';
+          }
+        } else {
+          res = 'ltr';
+        }
+      }
+    } else if (localName === 'bdi') {
+      const text = node.textContent.trim();
+      if (text) {
+        const { paragraphs: [{ level }] } = getEmbeddingLevels(text);
+        if (level % 2 === 1) {
+          res = 'rtl';
+        } else {
+          res = 'ltr';
+        }
+      }
+      if (!(res || parentNode)) {
+        res = 'ltr';
+      }
+    } else if (localName === 'input' && node.type === 'tel') {
+      res = 'ltr';
+    } else if (parentNode) {
+      if (localName === 'slot') {
+        const text = getSlottedTextContent(node);
+        if (text) {
+          const { paragraphs: [{ level }] } = getEmbeddingLevels(text);
+          if (level % 2 === 1) {
+            res = 'rtl';
+          } else {
+            res = 'ltr';
+          }
+        }
+      }
+      if (!res) {
+        const { nodeType: parentNodeType } = parentNode;
+        if (parentNodeType === ELEMENT_NODE) {
+          res = getDirectionality(parentNode);
+        } else if (parentNodeType === DOCUMENT_NODE ||
+                   parentNodeType === DOCUMENT_FRAGMENT_NODE) {
+          res = 'ltr';
+        }
+      }
+    } else {
+      res = 'ltr';
+    }
+  }
+  return res ?? null;
+};
+
+/**
+ * is content editable
+ * NOTE: not implemented in jsdom https://github.com/jsdom/jsdom/issues/1670
+ * @param {object} node - Element node
+ * @returns {boolean} - result
+ */
+export const isContentEditable = (node = {}) => {
+  let res;
+  if (node.nodeType === ELEMENT_NODE) {
+    if (typeof node.isContentEditable === 'boolean') {
+      res = node.isContentEditable;
+    } else if (node.ownerDocument.designMode === 'on') {
+      res = true;
+    } else if (node.hasAttribute('contenteditable')) {
+      const attr = node.getAttribute('contenteditable');
+      if (attr === '' || /^(?:plaintext-only|true)$/.test(attr)) {
+        res = true;
+      } else if (attr === 'inherit') {
+        let parent = node.parentNode;
+        while (parent) {
+          if (isContentEditable(parent)) {
+            res = true;
+            break;
+          }
+          parent = parent.parentNode;
+        }
+      }
+    }
+  }
+  return !!res;
+};
+
+/**
+ * is namespace declared
+ * @param {string} ns - namespace
+ * @param {object} node - Element node
+ * @returns {boolean} - result
+ */
+export const isNamespaceDeclared = (ns = '', node = {}) => {
+  let res;
+  if (ns && typeof ns === 'string' && node.nodeType === ELEMENT_NODE) {
+    const attr = `xmlns:${ns}`;
+    const root = node.ownerDocument.documentElement;
+    let parent = node;
+    while (parent) {
+      if (typeof parent.hasAttribute === 'function' &&
+          parent.hasAttribute(attr)) {
+        res = true;
+        break;
+      } else if (parent === root) {
+        break;
+      }
+      parent = parent.parentNode;
+    }
+  }
+  return !!res;
+};
+
+/**
+ * is inclusive - nodeA and nodeB are in inclusive relation
+ * @param {object} nodeA - Element node
+ * @param {object} nodeB - Element node
+ * @returns {boolean} - result
+ */
+export const isInclusive = (nodeA = {}, nodeB = {}) => {
+  let res;
+  if (nodeA.nodeType === ELEMENT_NODE && nodeB.nodeType === ELEMENT_NODE) {
+    const posBit = nodeB.compareDocumentPosition(nodeA);
+    res = posBit & DOCUMENT_POSITION_CONTAINS ||
+          posBit & DOCUMENT_POSITION_CONTAINED_BY;
+  }
+  return !!res;
+};
+
+/**
+ * is preceding - nodeA precedes and/or contains nodeB
+ * @param {object} nodeA - Element node
+ * @param {object} nodeB - Element node
+ * @returns {boolean} - result
+ */
+export const isPreceding = (nodeA = {}, nodeB = {}) => {
+  let res;
+  if (nodeA.nodeType === ELEMENT_NODE && nodeB.nodeType === ELEMENT_NODE) {
+    const posBit = nodeB.compareDocumentPosition(nodeA);
+    res = posBit & DOCUMENT_POSITION_PRECEDING ||
+          posBit & DOCUMENT_POSITION_CONTAINS;
+  }
+  return !!res;
+};
+
+/**
+ * selector to node properties - e.g. ns|E -> { prefix: ns, tagName: E }
+ * @param {string} selector - type selector
+ * @param {object} [node] - Element node
+ * @returns {object} - node properties
+ */
+export const selectorToNodeProps = (selector, node) => {
+  let prefix;
+  let tagName;
+  if (selector && typeof selector === 'string') {
+    if (selector.indexOf('|') > -1) {
+      [prefix, tagName] = selector.split('|');
+    } else {
+      prefix = '*';
+      tagName = selector;
+    }
+  } else {
+    throw new DOMException(`Invalid selector ${selector}`, SYNTAX_ERR);
+  }
+  return {
+    prefix,
+    tagName
+  };
+};

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/src/js/parser.js

@@ -0,0 +1,222 @@
+/**
+ * parser.js
+ */
+
+/* import */
+import { findAll, parse, toPlainObject, walk } from 'css-tree';
+
+/* constants */
+import {
+  DUO, HEX, MAX_BIT_16, BIT_HYPHEN, REG_LOGICAL_PSEUDO, REG_SHADOW_PSEUDO,
+  SELECTOR, SELECTOR_PSEUDO_CLASS, SELECTOR_PSEUDO_ELEMENT, SYNTAX_ERR,
+  TYPE_FROM, TYPE_TO, U_FFFD
+} from './constant.js';
+
+/**
+ * unescape selector
+ * @param {string} selector - CSS selector
+ * @returns {?string} - unescaped selector
+ */
+export const unescapeSelector = (selector = '') => {
+  if (typeof selector === 'string' && selector.indexOf('\\', 0) >= 0) {
+    const arr = selector.split('\\');
+    const l = arr.length;
+    for (let i = 1; i < l; i++) {
+      let item = arr[i];
+      if (item === '' && i === l - 1) {
+        item = U_FFFD;
+      } else {
+        const hexExists = /^([\da-f]{1,6}\s?)/i.exec(item);
+        if (hexExists) {
+          const [, hex] = hexExists;
+          let str;
+          try {
+            const low = parseInt('D800', HEX);
+            const high = parseInt('DFFF', HEX);
+            const deci = parseInt(hex, HEX);
+            if (deci === 0 || (deci >= low && deci <= high)) {
+              str = U_FFFD;
+            } else {
+              str = String.fromCodePoint(deci);
+            }
+          } catch (e) {
+            str = U_FFFD;
+          }
+          let postStr = '';
+          if (item.length > hex.length) {
+            postStr = item.substring(hex.length);
+          }
+          item = `${str}${postStr}`;
+        // whitespace
+        } else if (/^[\n\r\f]/.test(item)) {
+          item = '\\' + item;
+        }
+      }
+      arr[i] = item;
+    }
+    selector = arr.join('');
+  }
+  return selector;
+};
+
+/**
+ * preprocess
+ * @see https://drafts.csswg.org/css-syntax-3/#input-preprocessing
+ * @param {...*} args - arguments
+ * @returns {string} - filtered selector string
+ */
+export const preprocess = (...args) => {
+  if (!args.length) {
+    throw new TypeError('1 argument required, but only 0 present.');
+  }
+  let [selector] = args;
+  if (typeof selector === 'string') {
+    let index = 0;
+    while (index >= 0) {
+      index = selector.indexOf('#', index);
+      if (index < 0) {
+        break;
+      }
+      const preHash = selector.substring(0, index + 1);
+      let postHash = selector.substring(index + 1);
+      const codePoint = postHash.codePointAt(0);
+      // @see https://drafts.csswg.org/selectors/#id-selectors
+      // @see https://drafts.csswg.org/css-syntax-3/#ident-token-diagram
+      if (codePoint === BIT_HYPHEN) {
+        if (/^\d$/.test(postHash.substring(1, 2))) {
+          throw new DOMException(`Invalid selector ${selector}`, SYNTAX_ERR);
+        }
+      // escape char above 0xFFFF
+      } else if (codePoint > MAX_BIT_16) {
+        const str = `\\${codePoint.toString(HEX)} `;
+        if (postHash.length === DUO) {
+          postHash = str;
+        } else {
+          postHash = `${str}${postHash.substring(DUO)}`;
+        }
+      }
+      selector = `${preHash}${postHash}`;
+      index++;
+    }
+    selector = selector.replace(/\f|\r\n?/g, '\n')
+      .replace(/[\0\uD800-\uDFFF]|\\$/g, U_FFFD);
+  } else if (selector === undefined || selector === null) {
+    selector = Object.prototype.toString.call(selector)
+      .slice(TYPE_FROM, TYPE_TO).toLowerCase();
+  } else if (Array.isArray(selector)) {
+    selector = selector.join(',');
+  } else if (Object.prototype.hasOwnProperty.call(selector, 'toString')) {
+    selector = selector.toString();
+  } else {
+    throw new DOMException(`Invalid selector ${selector}`, SYNTAX_ERR);
+  }
+  return selector;
+};
+
+/**
+ * create AST from CSS selector
+ * @param {string} selector - CSS selector
+ * @returns {object} - AST
+ */
+export const parseSelector = selector => {
+  selector = preprocess(selector);
+  // invalid selectors
+  if (/^$|^\s*>|,\s*$/.test(selector)) {
+    throw new DOMException(`Invalid selector ${selector}`, SYNTAX_ERR);
+  }
+  let res;
+  try {
+    const ast = parse(selector, {
+      context: 'selectorList',
+      parseCustomProperty: true
+    });
+    res = toPlainObject(ast);
+  } catch (e) {
+    // workaround for https://github.com/csstree/csstree/issues/265
+    // NOTE: still throws on `:lang("")`;
+    const regLang = /(:lang\(\s*("[A-Za-z\d\-*]+")\s*\))/;
+    if (e.message === 'Identifier is expected' && regLang.test(selector)) {
+      const [, lang, range] = regLang.exec(selector);
+      const escapedRange =
+        range.replaceAll('*', '\\*').replace(/^"/, '').replace(/"$/, '');
+      const escapedLang = lang.replace(range, escapedRange);
+      res = parseSelector(selector.replace(lang, escapedLang));
+    } else if (e.message === '"]" is expected' && !selector.endsWith(']')) {
+      res = parseSelector(`${selector}]`);
+    } else if (e.message === '")" is expected' && !selector.endsWith(')')) {
+      res = parseSelector(`${selector})`);
+    } else {
+      throw new DOMException(e.message, SYNTAX_ERR);
+    }
+  }
+  return res;
+};
+
+/**
+ * walk AST
+ * @param {object} ast - AST
+ * @returns {Array.<object|undefined>} - collection of AST branches
+ */
+export const walkAST = (ast = {}) => {
+  const branches = new Set();
+  let hasPseudoFunc;
+  const opt = {
+    enter: node => {
+      if (node.type === SELECTOR) {
+        branches.add(node.children);
+      } else if ((node.type === SELECTOR_PSEUDO_CLASS &&
+                  REG_LOGICAL_PSEUDO.test(node.name)) ||
+                 (node.type === SELECTOR_PSEUDO_ELEMENT &&
+                  REG_SHADOW_PSEUDO.test(node.name))) {
+        hasPseudoFunc = true;
+      }
+    }
+  };
+  walk(ast, opt);
+  if (hasPseudoFunc) {
+    findAll(ast, (node, item, list) => {
+      if (list) {
+        if (node.type === SELECTOR_PSEUDO_CLASS &&
+            REG_LOGICAL_PSEUDO.test(node.name)) {
+          const itemList = list.filter(i => {
+            const { name, type } = i;
+            const res =
+              type === SELECTOR_PSEUDO_CLASS && REG_LOGICAL_PSEUDO.test(name);
+            return res;
+          });
+          for (const { children } of itemList) {
+            // SelectorList
+            for (const { children: grandChildren } of children) {
+              // Selector
+              for (const { children: greatGrandChildren } of grandChildren) {
+                if (branches.has(greatGrandChildren)) {
+                  branches.delete(greatGrandChildren);
+                }
+              }
+            }
+          }
+        } else if (node.type === SELECTOR_PSEUDO_ELEMENT &&
+                   REG_SHADOW_PSEUDO.test(node.name)) {
+          const itemList = list.filter(i => {
+            const { name, type } = i;
+            const res =
+              type === SELECTOR_PSEUDO_ELEMENT && REG_SHADOW_PSEUDO.test(name);
+            return res;
+          });
+          for (const { children } of itemList) {
+            // Selector
+            for (const { children: grandChildren } of children) {
+              if (branches.has(grandChildren)) {
+                branches.delete(grandChildren);
+              }
+            }
+          }
+        }
+      }
+    });
+  }
+  return [...branches];
+};
+
+/* export */
+export { generate as generateCSS } from 'css-tree';

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/types/index.d.ts

@@ -0,0 +1,12 @@
+export function matches(selector: string, node: object, opt?: {
+    warn?: boolean;
+}): boolean;
+export function closest(selector: string, node: object, opt?: {
+    warn?: boolean;
+}): object | null;
+export function querySelector(selector: string, node: object, opt?: {
+    warn?: boolean;
+}): object | null;
+export function querySelectorAll(selector: string, node: object, opt?: {
+    warn?: boolean;
+}): Array<object | undefined>;

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/types/js/constant.d.ts

@@ -0,0 +1,45 @@
+export const ALPHA_NUM: "[A-Z\\d]+";
+export const AN_PLUS_B: "AnPlusB";
+export const COMBINATOR: "Combinator";
+export const IDENTIFIER: "Identifier";
+export const NOT_SUPPORTED_ERR: "NotSupportedError";
+export const NTH: "Nth";
+export const RAW: "Raw";
+export const SELECTOR: "Selector";
+export const SELECTOR_ATTR: "AttributeSelector";
+export const SELECTOR_CLASS: "ClassSelector";
+export const SELECTOR_ID: "IdSelector";
+export const SELECTOR_LIST: "SelectorList";
+export const SELECTOR_PSEUDO_CLASS: "PseudoClassSelector";
+export const SELECTOR_PSEUDO_ELEMENT: "PseudoElementSelector";
+export const SELECTOR_TYPE: "TypeSelector";
+export const STRING: "String";
+export const SYNTAX_ERR: "SyntaxError";
+export const U_FFFD: "<22>";
+export const BIT_01: 1;
+export const BIT_02: 2;
+export const BIT_04: 4;
+export const BIT_08: 8;
+export const BIT_16: 16;
+export const BIT_32: 32;
+export const BIT_HYPHEN: 45;
+export const DUO: 2;
+export const HEX: 16;
+export const MAX_BIT_16: 65535;
+export const TYPE_FROM: 8;
+export const TYPE_TO: -1;
+export const ELEMENT_NODE: 1;
+export const TEXT_NODE: 3;
+export const DOCUMENT_NODE: 9;
+export const DOCUMENT_FRAGMENT_NODE: 11;
+export const DOCUMENT_POSITION_PRECEDING: 2;
+export const DOCUMENT_POSITION_CONTAINS: 8;
+export const DOCUMENT_POSITION_CONTAINED_BY: 16;
+export const SHOW_ALL: 4294967295;
+export const SHOW_DOCUMENT: 256;
+export const SHOW_DOCUMENT_FRAGMENT: 1024;
+export const SHOW_ELEMENT: 1;
+export const REG_LOGICAL_PSEUDO: RegExp;
+export const REG_SHADOW_HOST: RegExp;
+export const REG_SHADOW_MODE: RegExp;
+export const REG_SHADOW_PSEUDO: RegExp;

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/types/js/dom-util.d.ts

@@ -0,0 +1,8 @@
+export function isInShadowTree(node?: object): boolean;
+export function getSlottedTextContent(node?: object): string | null;
+export function getDirectionality(node?: object): string | null;
+export function isContentEditable(node?: object): boolean;
+export function isNamespaceDeclared(ns?: string, node?: object): boolean;
+export function isInclusive(nodeA?: object, nodeB?: object): boolean;
+export function isPreceding(nodeA?: object, nodeB?: object): boolean;
+export function selectorToNodeProps(selector: string, node?: object): object;

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/types/js/matcher.d.ts

@@ -0,0 +1,61 @@
+export class Matcher {
+    constructor(selector: string, node: object, opt?: {
+        warn?: boolean;
+    });
+    _onError(e: Error): void;
+    _setup(node: object): Array<object>;
+    _sortLeaves(leaves: Array<object>): Array<object>;
+    _correspond(selector: string): Array<Array<object | undefined>>;
+    _traverse(node?: object, walker?: object): object | null;
+    _collectNthChild(anb: {
+        a: number;
+        b: number;
+        reverse?: boolean;
+        selector?: object;
+    }, node: object): Set<object>;
+    _collectNthOfType(anb: {
+        a: number;
+        b: number;
+        reverse?: boolean;
+    }, node: object): Set<object>;
+    _matchAnPlusB(ast: object, node: object, nthName: string): Set<object>;
+    _matchPseudoElementSelector(astName: string, opt?: {
+        forgive?: boolean;
+    }): void;
+    _matchDirectionPseudoClass(ast: object, node: object): object | null;
+    _matchLanguagePseudoClass(ast: object, node: object): object | null;
+    _matchHasPseudoFunc(leaves: Array<object>, node: object): boolean;
+    _matchLogicalPseudoFunc(astData: object, node: object): object | null;
+    _matchPseudoClassSelector(ast: object, node: object, opt?: {
+        forgive?: boolean;
+    }): Set<object>;
+    _matchAttributeSelector(ast: object, node: object): object | null;
+    _matchClassSelector(ast: object, node: object): object | null;
+    _matchIDSelector(ast: object, node: object): object | null;
+    _matchTypeSelector(ast: object, node: object, opt?: {
+        forgive?: boolean;
+    }): object | null;
+    _matchShadowHostPseudoClass(ast: object, node: object): object | null;
+    _matchSelector(ast: object, node: object, opt?: object): Set<object>;
+    _matchLeaves(leaves: Array<object>, node: object, opt?: object): boolean;
+    _findDescendantNodes(leaves: Array<object>, baseNode: object): object;
+    _matchCombinator(twig: object, node: object, opt?: {
+        dir?: string;
+        forgive?: boolean;
+    }): Set<object>;
+    _findNode(leaves: Array<object>, opt?: {
+        node?: object;
+        tree?: object;
+    }): object | null;
+    _findEntryNodes(twig: object, targetType: string): object;
+    _getEntryTwig(branch: Array<object>, targetType: string): object;
+    _collectNodes(targetType: string): Array<Array<object | undefined>>;
+    _sortNodes(nodes: Array<object> | Set<object>): Array<object | undefined>;
+    _matchNodes(targetType: string): Set<object>;
+    _find(targetType: string): Set<object>;
+    matches(): boolean;
+    closest(): object | null;
+    querySelector(): object | null;
+    querySelectorAll(): Array<object | undefined>;
+    #private;
+}

capabilities/testdrive-jsui/node_modules/@asamuzakjp/dom-selector/types/js/parser.d.ts

@@ -0,0 +1,5 @@
+export function unescapeSelector(selector?: string): string | null;
+export function preprocess(...args: any[]): string;
+export function parseSelector(selector: string): object;
+export function walkAST(ast?: object): Array<object | undefined>;
+export { generate as generateCSS } from "css-tree";

capabilities/testdrive-jsui/node_modules/@babel/code-frame/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2014-present Sebastian McKenzie and other contributors
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

capabilities/testdrive-jsui/node_modules/@babel/code-frame/README.md

@@ -0,0 +1,19 @@
+# @babel/code-frame
+
+> Generate errors that contain a code frame that point to source locations.
+
+See our website [@babel/code-frame](https://babeljs.io/docs/babel-code-frame) for more information.
+
+## Install
+
+Using npm:
+
+```sh
+npm install --save-dev @babel/code-frame
+```
+
+or using yarn:
+
+```sh
+yarn add @babel/code-frame --dev
+```

capabilities/testdrive-jsui/node_modules/@babel/code-frame/package.json

@@ -0,0 +1,31 @@
+{
+  "name": "@babel/code-frame",
+  "version": "7.27.1",
+  "description": "Generate errors that contain a code frame that point to source locations.",
+  "author": "The Babel Team (https://babel.dev/team)",
+  "homepage": "https://babel.dev/docs/en/next/babel-code-frame",
+  "bugs": "https://github.com/babel/babel/issues?utf8=%E2%9C%93&q=is%3Aissue+is%3Aopen",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/babel/babel.git",
+    "directory": "packages/babel-code-frame"
+  },
+  "main": "./lib/index.js",
+  "dependencies": {
+    "@babel/helper-validator-identifier": "^7.27.1",
+    "js-tokens": "^4.0.0",
+    "picocolors": "^1.1.1"
+  },
+  "devDependencies": {
+    "import-meta-resolve": "^4.1.0",
+    "strip-ansi": "^4.0.0"
+  },
+  "engines": {
+    "node": ">=6.9.0"
+  },
+  "type": "commonjs"
+}

capabilities/testdrive-jsui/node_modules/@babel/compat-data/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2014-present Sebastian McKenzie and other contributors
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

capabilities/testdrive-jsui/node_modules/@babel/compat-data/README.md

@@ -0,0 +1,19 @@
+# @babel/compat-data
+
+> The compat-data to determine required Babel plugins
+
+See our website [@babel/compat-data](https://babeljs.io/docs/babel-compat-data) for more information.
+
+## Install
+
+Using npm:
+
+```sh
+npm install --save @babel/compat-data
+```
+
+or using yarn:
+
+```sh
+yarn add @babel/compat-data
+```

capabilities/testdrive-jsui/node_modules/@babel/compat-data/corejs2-built-ins.js

@@ -0,0 +1,2 @@
+// Todo (Babel 8): remove this file as Babel 8 drop support of core-js 2
+module.exports = require("./data/corejs2-built-ins.json");

capabilities/testdrive-jsui/node_modules/@babel/compat-data/corejs3-shipped-proposals.js

@@ -0,0 +1,2 @@
+// Todo (Babel 8): remove this file now that it is included in babel-plugin-polyfill-corejs3
+module.exports = require("./data/corejs3-shipped-proposals.json");

capabilities/testdrive-jsui/node_modules/@babel/compat-data/data/corejs3-shipped-proposals.json

@@ -0,0 +1,5 @@
+[
+  "esnext.promise.all-settled",
+  "esnext.string.match-all",
+  "esnext.global-this"
+]

capabilities/testdrive-jsui/node_modules/@babel/compat-data/data/native-modules.json

@@ -0,0 +1,18 @@
+{
+  "es6.module": {
+    "chrome": "61",
+    "and_chr": "61",
+    "edge": "16",
+    "firefox": "60",
+    "and_ff": "60",
+    "node": "13.2.0",
+    "opera": "48",
+    "op_mob": "45",
+    "safari": "10.1",
+    "ios": "10.3",
+    "samsung": "8.2",
+    "android": "61",
+    "electron": "2.0",
+    "ios_saf": "10.3"
+  }
+}

capabilities/testdrive-jsui/node_modules/@babel/compat-data/data/overlapping-plugins.json

@@ -0,0 +1,35 @@
+{
+  "transform-async-to-generator": [
+    "bugfix/transform-async-arrows-in-class"
+  ],
+  "transform-parameters": [
+    "bugfix/transform-edge-default-parameters",
+    "bugfix/transform-safari-id-destructuring-collision-in-function-expression"
+  ],
+  "transform-function-name": [
+    "bugfix/transform-edge-function-name"
+  ],
+  "transform-block-scoping": [
+    "bugfix/transform-safari-block-shadowing",
+    "bugfix/transform-safari-for-shadowing"
+  ],
+  "transform-template-literals": [
+    "bugfix/transform-tagged-template-caching"
+  ],
+  "transform-optional-chaining": [
+    "bugfix/transform-v8-spread-parameters-in-optional-chaining"
+  ],
+  "proposal-optional-chaining": [
+    "bugfix/transform-v8-spread-parameters-in-optional-chaining"
+  ],
+  "transform-class-properties": [
+    "bugfix/transform-v8-static-class-fields-redefine-readonly",
+    "bugfix/transform-firefox-class-in-computed-class-key",
+    "bugfix/transform-safari-class-field-initializer-scope"
+  ],
+  "proposal-class-properties": [
+    "bugfix/transform-v8-static-class-fields-redefine-readonly",
+    "bugfix/transform-firefox-class-in-computed-class-key",
+    "bugfix/transform-safari-class-field-initializer-scope"
+  ]
+}

capabilities/testdrive-jsui/node_modules/@babel/compat-data/data/plugin-bugfixes.json

@@ -0,0 +1,203 @@
+{
+  "bugfix/transform-async-arrows-in-class": {
+    "chrome": "55",
+    "opera": "42",
+    "edge": "15",
+    "firefox": "52",
+    "safari": "11",
+    "node": "7.6",
+    "deno": "1",
+    "ios": "11",
+    "samsung": "6",
+    "opera_mobile": "42",
+    "electron": "1.6"
+  },
+  "bugfix/transform-edge-default-parameters": {
+    "chrome": "49",
+    "opera": "36",
+    "edge": "18",
+    "firefox": "52",
+    "safari": "10",
+    "node": "6",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "36",
+    "electron": "0.37"
+  },
+  "bugfix/transform-edge-function-name": {
+    "chrome": "51",
+    "opera": "38",
+    "edge": "79",
+    "firefox": "53",
+    "safari": "10",
+    "node": "6.5",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "41",
+    "electron": "1.2"
+  },
+  "bugfix/transform-safari-block-shadowing": {
+    "chrome": "49",
+    "opera": "36",
+    "edge": "12",
+    "firefox": "44",
+    "safari": "11",
+    "node": "6",
+    "deno": "1",
+    "ie": "11",
+    "ios": "11",
+    "samsung": "5",
+    "opera_mobile": "36",
+    "electron": "0.37"
+  },
+  "bugfix/transform-safari-for-shadowing": {
+    "chrome": "49",
+    "opera": "36",
+    "edge": "12",
+    "firefox": "4",
+    "safari": "11",
+    "node": "6",
+    "deno": "1",
+    "ie": "11",
+    "ios": "11",
+    "samsung": "5",
+    "rhino": "1.7.13",
+    "opera_mobile": "36",
+    "electron": "0.37"
+  },
+  "bugfix/transform-safari-id-destructuring-collision-in-function-expression": {
+    "chrome": "49",
+    "opera": "36",
+    "edge": "14",
+    "firefox": "2",
+    "safari": "16.3",
+    "node": "6",
+    "deno": "1",
+    "ios": "16.3",
+    "samsung": "5",
+    "opera_mobile": "36",
+    "electron": "0.37"
+  },
+  "bugfix/transform-tagged-template-caching": {
+    "chrome": "41",
+    "opera": "28",
+    "edge": "12",
+    "firefox": "34",
+    "safari": "13",
+    "node": "4",
+    "deno": "1",
+    "ios": "13",
+    "samsung": "3.4",
+    "rhino": "1.7.14",
+    "opera_mobile": "28",
+    "electron": "0.21"
+  },
+  "bugfix/transform-v8-spread-parameters-in-optional-chaining": {
+    "chrome": "91",
+    "opera": "77",
+    "edge": "91",
+    "firefox": "74",
+    "safari": "13.1",
+    "node": "16.9",
+    "deno": "1.9",
+    "ios": "13.4",
+    "samsung": "16",
+    "opera_mobile": "64",
+    "electron": "13.0"
+  },
+  "transform-optional-chaining": {
+    "chrome": "80",
+    "opera": "67",
+    "edge": "80",
+    "firefox": "74",
+    "safari": "13.1",
+    "node": "14",
+    "deno": "1",
+    "ios": "13.4",
+    "samsung": "13",
+    "rhino": "1.8",
+    "opera_mobile": "57",
+    "electron": "8.0"
+  },
+  "proposal-optional-chaining": {
+    "chrome": "80",
+    "opera": "67",
+    "edge": "80",
+    "firefox": "74",
+    "safari": "13.1",
+    "node": "14",
+    "deno": "1",
+    "ios": "13.4",
+    "samsung": "13",
+    "rhino": "1.8",
+    "opera_mobile": "57",
+    "electron": "8.0"
+  },
+  "transform-parameters": {
+    "chrome": "49",
+    "opera": "36",
+    "edge": "15",
+    "firefox": "52",
+    "safari": "10",
+    "node": "6",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "36",
+    "electron": "0.37"
+  },
+  "transform-async-to-generator": {
+    "chrome": "55",
+    "opera": "42",
+    "edge": "15",
+    "firefox": "52",
+    "safari": "10.1",
+    "node": "7.6",
+    "deno": "1",
+    "ios": "10.3",
+    "samsung": "6",
+    "opera_mobile": "42",
+    "electron": "1.6"
+  },
+  "transform-template-literals": {
+    "chrome": "41",
+    "opera": "28",
+    "edge": "13",
+    "firefox": "34",
+    "safari": "9",
+    "node": "4",
+    "deno": "1",
+    "ios": "9",
+    "samsung": "3.4",
+    "opera_mobile": "28",
+    "electron": "0.21"
+  },
+  "transform-function-name": {
+    "chrome": "51",
+    "opera": "38",
+    "edge": "14",
+    "firefox": "53",
+    "safari": "10",
+    "node": "6.5",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "41",
+    "electron": "1.2"
+  },
+  "transform-block-scoping": {
+    "chrome": "50",
+    "opera": "37",
+    "edge": "14",
+    "firefox": "53",
+    "safari": "10",
+    "node": "6",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "37",
+    "electron": "1.1"
+  }
+}

capabilities/testdrive-jsui/node_modules/@babel/compat-data/data/plugins.json

@@ -0,0 +1,838 @@
+{
+  "transform-explicit-resource-management": {
+    "chrome": "134",
+    "edge": "134",
+    "firefox": "141",
+    "node": "24",
+    "electron": "35.0"
+  },
+  "transform-duplicate-named-capturing-groups-regex": {
+    "chrome": "126",
+    "opera": "112",
+    "edge": "126",
+    "firefox": "129",
+    "safari": "17.4",
+    "node": "23",
+    "ios": "17.4",
+    "electron": "31.0"
+  },
+  "transform-regexp-modifiers": {
+    "chrome": "125",
+    "opera": "111",
+    "edge": "125",
+    "firefox": "132",
+    "node": "23",
+    "samsung": "27",
+    "electron": "31.0"
+  },
+  "transform-unicode-sets-regex": {
+    "chrome": "112",
+    "opera": "98",
+    "edge": "112",
+    "firefox": "116",
+    "safari": "17",
+    "node": "20",
+    "deno": "1.32",
+    "ios": "17",
+    "samsung": "23",
+    "opera_mobile": "75",
+    "electron": "24.0"
+  },
+  "bugfix/transform-v8-static-class-fields-redefine-readonly": {
+    "chrome": "98",
+    "opera": "84",
+    "edge": "98",
+    "firefox": "75",
+    "safari": "15",
+    "node": "12",
+    "deno": "1.18",
+    "ios": "15",
+    "samsung": "11",
+    "opera_mobile": "52",
+    "electron": "17.0"
+  },
+  "bugfix/transform-firefox-class-in-computed-class-key": {
+    "chrome": "74",
+    "opera": "62",
+    "edge": "79",
+    "firefox": "126",
+    "safari": "16",
+    "node": "12",
+    "deno": "1",
+    "ios": "16",
+    "samsung": "11",
+    "opera_mobile": "53",
+    "electron": "6.0"
+  },
+  "bugfix/transform-safari-class-field-initializer-scope": {
+    "chrome": "74",
+    "opera": "62",
+    "edge": "79",
+    "firefox": "69",
+    "safari": "16",
+    "node": "12",
+    "deno": "1",
+    "ios": "16",
+    "samsung": "11",
+    "opera_mobile": "53",
+    "electron": "6.0"
+  },
+  "transform-class-static-block": {
+    "chrome": "94",
+    "opera": "80",
+    "edge": "94",
+    "firefox": "93",
+    "safari": "16.4",
+    "node": "16.11",
+    "deno": "1.14",
+    "ios": "16.4",
+    "samsung": "17",
+    "opera_mobile": "66",
+    "electron": "15.0"
+  },
+  "proposal-class-static-block": {
+    "chrome": "94",
+    "opera": "80",
+    "edge": "94",
+    "firefox": "93",
+    "safari": "16.4",
+    "node": "16.11",
+    "deno": "1.14",
+    "ios": "16.4",
+    "samsung": "17",
+    "opera_mobile": "66",
+    "electron": "15.0"
+  },
+  "transform-private-property-in-object": {
+    "chrome": "91",
+    "opera": "77",
+    "edge": "91",
+    "firefox": "90",
+    "safari": "15",
+    "node": "16.9",
+    "deno": "1.9",
+    "ios": "15",
+    "samsung": "16",
+    "opera_mobile": "64",
+    "electron": "13.0"
+  },
+  "proposal-private-property-in-object": {
+    "chrome": "91",
+    "opera": "77",
+    "edge": "91",
+    "firefox": "90",
+    "safari": "15",
+    "node": "16.9",
+    "deno": "1.9",
+    "ios": "15",
+    "samsung": "16",
+    "opera_mobile": "64",
+    "electron": "13.0"
+  },
+  "transform-class-properties": {
+    "chrome": "74",
+    "opera": "62",
+    "edge": "79",
+    "firefox": "90",
+    "safari": "14.1",
+    "node": "12",
+    "deno": "1",
+    "ios": "14.5",
+    "samsung": "11",
+    "opera_mobile": "53",
+    "electron": "6.0"
+  },
+  "proposal-class-properties": {
+    "chrome": "74",
+    "opera": "62",
+    "edge": "79",
+    "firefox": "90",
+    "safari": "14.1",
+    "node": "12",
+    "deno": "1",
+    "ios": "14.5",
+    "samsung": "11",
+    "opera_mobile": "53",
+    "electron": "6.0"
+  },
+  "transform-private-methods": {
+    "chrome": "84",
+    "opera": "70",
+    "edge": "84",
+    "firefox": "90",
+    "safari": "15",
+    "node": "14.6",
+    "deno": "1",
+    "ios": "15",
+    "samsung": "14",
+    "opera_mobile": "60",
+    "electron": "10.0"
+  },
+  "proposal-private-methods": {
+    "chrome": "84",
+    "opera": "70",
+    "edge": "84",
+    "firefox": "90",
+    "safari": "15",
+    "node": "14.6",
+    "deno": "1",
+    "ios": "15",
+    "samsung": "14",
+    "opera_mobile": "60",
+    "electron": "10.0"
+  },
+  "transform-numeric-separator": {
+    "chrome": "75",
+    "opera": "62",
+    "edge": "79",
+    "firefox": "70",
+    "safari": "13",
+    "node": "12.5",
+    "deno": "1",
+    "ios": "13",
+    "samsung": "11",
+    "rhino": "1.7.14",
+    "opera_mobile": "54",
+    "electron": "6.0"
+  },
+  "proposal-numeric-separator": {
+    "chrome": "75",
+    "opera": "62",
+    "edge": "79",
+    "firefox": "70",
+    "safari": "13",
+    "node": "12.5",
+    "deno": "1",
+    "ios": "13",
+    "samsung": "11",
+    "rhino": "1.7.14",
+    "opera_mobile": "54",
+    "electron": "6.0"
+  },
+  "transform-logical-assignment-operators": {
+    "chrome": "85",
+    "opera": "71",
+    "edge": "85",
+    "firefox": "79",
+    "safari": "14",
+    "node": "15",
+    "deno": "1.2",
+    "ios": "14",
+    "samsung": "14",
+    "opera_mobile": "60",
+    "electron": "10.0"
+  },
+  "proposal-logical-assignment-operators": {
+    "chrome": "85",
+    "opera": "71",
+    "edge": "85",
+    "firefox": "79",
+    "safari": "14",
+    "node": "15",
+    "deno": "1.2",
+    "ios": "14",
+    "samsung": "14",
+    "opera_mobile": "60",
+    "electron": "10.0"
+  },
+  "transform-nullish-coalescing-operator": {
+    "chrome": "80",
+    "opera": "67",
+    "edge": "80",
+    "firefox": "72",
+    "safari": "13.1",
+    "node": "14",
+    "deno": "1",
+    "ios": "13.4",
+    "samsung": "13",
+    "rhino": "1.8",
+    "opera_mobile": "57",
+    "electron": "8.0"
+  },
+  "proposal-nullish-coalescing-operator": {
+    "chrome": "80",
+    "opera": "67",
+    "edge": "80",
+    "firefox": "72",
+    "safari": "13.1",
+    "node": "14",
+    "deno": "1",
+    "ios": "13.4",
+    "samsung": "13",
+    "rhino": "1.8",
+    "opera_mobile": "57",
+    "electron": "8.0"
+  },
+  "transform-optional-chaining": {
+    "chrome": "91",
+    "opera": "77",
+    "edge": "91",
+    "firefox": "74",
+    "safari": "13.1",
+    "node": "16.9",
+    "deno": "1.9",
+    "ios": "13.4",
+    "samsung": "16",
+    "opera_mobile": "64",
+    "electron": "13.0"
+  },
+  "proposal-optional-chaining": {
+    "chrome": "91",
+    "opera": "77",
+    "edge": "91",
+    "firefox": "74",
+    "safari": "13.1",
+    "node": "16.9",
+    "deno": "1.9",
+    "ios": "13.4",
+    "samsung": "16",
+    "opera_mobile": "64",
+    "electron": "13.0"
+  },
+  "transform-json-strings": {
+    "chrome": "66",
+    "opera": "53",
+    "edge": "79",
+    "firefox": "62",
+    "safari": "12",
+    "node": "10",
+    "deno": "1",
+    "ios": "12",
+    "samsung": "9",
+    "rhino": "1.7.14",
+    "opera_mobile": "47",
+    "electron": "3.0"
+  },
+  "proposal-json-strings": {
+    "chrome": "66",
+    "opera": "53",
+    "edge": "79",
+    "firefox": "62",
+    "safari": "12",
+    "node": "10",
+    "deno": "1",
+    "ios": "12",
+    "samsung": "9",
+    "rhino": "1.7.14",
+    "opera_mobile": "47",
+    "electron": "3.0"
+  },
+  "transform-optional-catch-binding": {
+    "chrome": "66",
+    "opera": "53",
+    "edge": "79",
+    "firefox": "58",
+    "safari": "11.1",
+    "node": "10",
+    "deno": "1",
+    "ios": "11.3",
+    "samsung": "9",
+    "opera_mobile": "47",
+    "electron": "3.0"
+  },
+  "proposal-optional-catch-binding": {
+    "chrome": "66",
+    "opera": "53",
+    "edge": "79",
+    "firefox": "58",
+    "safari": "11.1",
+    "node": "10",
+    "deno": "1",
+    "ios": "11.3",
+    "samsung": "9",
+    "opera_mobile": "47",
+    "electron": "3.0"
+  },
+  "transform-parameters": {
+    "chrome": "49",
+    "opera": "36",
+    "edge": "18",
+    "firefox": "52",
+    "safari": "16.3",
+    "node": "6",
+    "deno": "1",
+    "ios": "16.3",
+    "samsung": "5",
+    "opera_mobile": "36",
+    "electron": "0.37"
+  },
+  "transform-async-generator-functions": {
+    "chrome": "63",
+    "opera": "50",
+    "edge": "79",
+    "firefox": "57",
+    "safari": "12",
+    "node": "10",
+    "deno": "1",
+    "ios": "12",
+    "samsung": "8",
+    "opera_mobile": "46",
+    "electron": "3.0"
+  },
+  "proposal-async-generator-functions": {
+    "chrome": "63",
+    "opera": "50",
+    "edge": "79",
+    "firefox": "57",
+    "safari": "12",
+    "node": "10",
+    "deno": "1",
+    "ios": "12",
+    "samsung": "8",
+    "opera_mobile": "46",
+    "electron": "3.0"
+  },
+  "transform-object-rest-spread": {
+    "chrome": "60",
+    "opera": "47",
+    "edge": "79",
+    "firefox": "55",
+    "safari": "11.1",
+    "node": "8.3",
+    "deno": "1",
+    "ios": "11.3",
+    "samsung": "8",
+    "opera_mobile": "44",
+    "electron": "2.0"
+  },
+  "proposal-object-rest-spread": {
+    "chrome": "60",
+    "opera": "47",
+    "edge": "79",
+    "firefox": "55",
+    "safari": "11.1",
+    "node": "8.3",
+    "deno": "1",
+    "ios": "11.3",
+    "samsung": "8",
+    "opera_mobile": "44",
+    "electron": "2.0"
+  },
+  "transform-dotall-regex": {
+    "chrome": "62",
+    "opera": "49",
+    "edge": "79",
+    "firefox": "78",
+    "safari": "11.1",
+    "node": "8.10",
+    "deno": "1",
+    "ios": "11.3",
+    "samsung": "8",
+    "rhino": "1.7.15",
+    "opera_mobile": "46",
+    "electron": "3.0"
+  },
+  "transform-unicode-property-regex": {
+    "chrome": "64",
+    "opera": "51",
+    "edge": "79",
+    "firefox": "78",
+    "safari": "11.1",
+    "node": "10",
+    "deno": "1",
+    "ios": "11.3",
+    "samsung": "9",
+    "opera_mobile": "47",
+    "electron": "3.0"
+  },
+  "proposal-unicode-property-regex": {
+    "chrome": "64",
+    "opera": "51",
+    "edge": "79",
+    "firefox": "78",
+    "safari": "11.1",
+    "node": "10",
+    "deno": "1",
+    "ios": "11.3",
+    "samsung": "9",
+    "opera_mobile": "47",
+    "electron": "3.0"
+  },
+  "transform-named-capturing-groups-regex": {
+    "chrome": "64",
+    "opera": "51",
+    "edge": "79",
+    "firefox": "78",
+    "safari": "11.1",
+    "node": "10",
+    "deno": "1",
+    "ios": "11.3",
+    "samsung": "9",
+    "opera_mobile": "47",
+    "electron": "3.0"
+  },
+  "transform-async-to-generator": {
+    "chrome": "55",
+    "opera": "42",
+    "edge": "15",
+    "firefox": "52",
+    "safari": "11",
+    "node": "7.6",
+    "deno": "1",
+    "ios": "11",
+    "samsung": "6",
+    "opera_mobile": "42",
+    "electron": "1.6"
+  },
+  "transform-exponentiation-operator": {
+    "chrome": "52",
+    "opera": "39",
+    "edge": "14",
+    "firefox": "52",
+    "safari": "10.1",
+    "node": "7",
+    "deno": "1",
+    "ios": "10.3",
+    "samsung": "6",
+    "rhino": "1.7.14",
+    "opera_mobile": "41",
+    "electron": "1.3"
+  },
+  "transform-template-literals": {
+    "chrome": "41",
+    "opera": "28",
+    "edge": "13",
+    "firefox": "34",
+    "safari": "13",
+    "node": "4",
+    "deno": "1",
+    "ios": "13",
+    "samsung": "3.4",
+    "opera_mobile": "28",
+    "electron": "0.21"
+  },
+  "transform-literals": {
+    "chrome": "44",
+    "opera": "31",
+    "edge": "12",
+    "firefox": "53",
+    "safari": "9",
+    "node": "4",
+    "deno": "1",
+    "ios": "9",
+    "samsung": "4",
+    "rhino": "1.7.15",
+    "opera_mobile": "32",
+    "electron": "0.30"
+  },
+  "transform-function-name": {
+    "chrome": "51",
+    "opera": "38",
+    "edge": "79",
+    "firefox": "53",
+    "safari": "10",
+    "node": "6.5",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "41",
+    "electron": "1.2"
+  },
+  "transform-arrow-functions": {
+    "chrome": "47",
+    "opera": "34",
+    "edge": "13",
+    "firefox": "43",
+    "safari": "10",
+    "node": "6",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "rhino": "1.7.13",
+    "opera_mobile": "34",
+    "electron": "0.36"
+  },
+  "transform-block-scoped-functions": {
+    "chrome": "41",
+    "opera": "28",
+    "edge": "12",
+    "firefox": "46",
+    "safari": "10",
+    "node": "4",
+    "deno": "1",
+    "ie": "11",
+    "ios": "10",
+    "samsung": "3.4",
+    "opera_mobile": "28",
+    "electron": "0.21"
+  },
+  "transform-classes": {
+    "chrome": "46",
+    "opera": "33",
+    "edge": "13",
+    "firefox": "45",
+    "safari": "10",
+    "node": "5",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "33",
+    "electron": "0.36"
+  },
+  "transform-object-super": {
+    "chrome": "46",
+    "opera": "33",
+    "edge": "13",
+    "firefox": "45",
+    "safari": "10",
+    "node": "5",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "33",
+    "electron": "0.36"
+  },
+  "transform-shorthand-properties": {
+    "chrome": "43",
+    "opera": "30",
+    "edge": "12",
+    "firefox": "33",
+    "safari": "9",
+    "node": "4",
+    "deno": "1",
+    "ios": "9",
+    "samsung": "4",
+    "rhino": "1.7.14",
+    "opera_mobile": "30",
+    "electron": "0.27"
+  },
+  "transform-duplicate-keys": {
+    "chrome": "42",
+    "opera": "29",
+    "edge": "12",
+    "firefox": "34",
+    "safari": "9",
+    "node": "4",
+    "deno": "1",
+    "ios": "9",
+    "samsung": "3.4",
+    "opera_mobile": "29",
+    "electron": "0.25"
+  },
+  "transform-computed-properties": {
+    "chrome": "44",
+    "opera": "31",
+    "edge": "12",
+    "firefox": "34",
+    "safari": "7.1",
+    "node": "4",
+    "deno": "1",
+    "ios": "8",
+    "samsung": "4",
+    "rhino": "1.8",
+    "opera_mobile": "32",
+    "electron": "0.30"
+  },
+  "transform-for-of": {
+    "chrome": "51",
+    "opera": "38",
+    "edge": "15",
+    "firefox": "53",
+    "safari": "10",
+    "node": "6.5",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "41",
+    "electron": "1.2"
+  },
+  "transform-sticky-regex": {
+    "chrome": "49",
+    "opera": "36",
+    "edge": "13",
+    "firefox": "3",
+    "safari": "10",
+    "node": "6",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "rhino": "1.7.15",
+    "opera_mobile": "36",
+    "electron": "0.37"
+  },
+  "transform-unicode-escapes": {
+    "chrome": "44",
+    "opera": "31",
+    "edge": "12",
+    "firefox": "53",
+    "safari": "9",
+    "node": "4",
+    "deno": "1",
+    "ios": "9",
+    "samsung": "4",
+    "rhino": "1.7.15",
+    "opera_mobile": "32",
+    "electron": "0.30"
+  },
+  "transform-unicode-regex": {
+    "chrome": "50",
+    "opera": "37",
+    "edge": "13",
+    "firefox": "46",
+    "safari": "12",
+    "node": "6",
+    "deno": "1",
+    "ios": "12",
+    "samsung": "5",
+    "opera_mobile": "37",
+    "electron": "1.1"
+  },
+  "transform-spread": {
+    "chrome": "46",
+    "opera": "33",
+    "edge": "13",
+    "firefox": "45",
+    "safari": "10",
+    "node": "5",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "33",
+    "electron": "0.36"
+  },
+  "transform-destructuring": {
+    "chrome": "51",
+    "opera": "38",
+    "edge": "15",
+    "firefox": "53",
+    "safari": "10",
+    "node": "6.5",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "41",
+    "electron": "1.2"
+  },
+  "transform-block-scoping": {
+    "chrome": "50",
+    "opera": "37",
+    "edge": "14",
+    "firefox": "53",
+    "safari": "11",
+    "node": "6",
+    "deno": "1",
+    "ios": "11",
+    "samsung": "5",
+    "opera_mobile": "37",
+    "electron": "1.1"
+  },
+  "transform-typeof-symbol": {
+    "chrome": "48",
+    "opera": "35",
+    "edge": "12",
+    "firefox": "36",
+    "safari": "9",
+    "node": "6",
+    "deno": "1",
+    "ios": "9",
+    "samsung": "5",
+    "rhino": "1.8",
+    "opera_mobile": "35",
+    "electron": "0.37"
+  },
+  "transform-new-target": {
+    "chrome": "46",
+    "opera": "33",
+    "edge": "14",
+    "firefox": "41",
+    "safari": "10",
+    "node": "5",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "33",
+    "electron": "0.36"
+  },
+  "transform-regenerator": {
+    "chrome": "50",
+    "opera": "37",
+    "edge": "13",
+    "firefox": "53",
+    "safari": "10",
+    "node": "6",
+    "deno": "1",
+    "ios": "10",
+    "samsung": "5",
+    "opera_mobile": "37",
+    "electron": "1.1"
+  },
+  "transform-member-expression-literals": {
+    "chrome": "7",
+    "opera": "12",
+    "edge": "12",
+    "firefox": "2",
+    "safari": "5.1",
+    "node": "0.4",
+    "deno": "1",
+    "ie": "9",
+    "android": "4",
+    "ios": "6",
+    "phantom": "1.9",
+    "samsung": "1",
+    "rhino": "1.7.13",
+    "opera_mobile": "12",
+    "electron": "0.20"
+  },
+  "transform-property-literals": {
+    "chrome": "7",
+    "opera": "12",
+    "edge": "12",
+    "firefox": "2",
+    "safari": "5.1",
+    "node": "0.4",
+    "deno": "1",
+    "ie": "9",
+    "android": "4",
+    "ios": "6",
+    "phantom": "1.9",
+    "samsung": "1",
+    "rhino": "1.7.13",
+    "opera_mobile": "12",
+    "electron": "0.20"
+  },
+  "transform-reserved-words": {
+    "chrome": "13",
+    "opera": "10.50",
+    "edge": "12",
+    "firefox": "2",
+    "safari": "3.1",
+    "node": "0.6",
+    "deno": "1",
+    "ie": "9",
+    "android": "4.4",
+    "ios": "6",
+    "phantom": "1.9",
+    "samsung": "1",
+    "rhino": "1.7.13",
+    "opera_mobile": "10.1",
+    "electron": "0.20"
+  },
+  "transform-export-namespace-from": {
+    "chrome": "72",
+    "deno": "1.0",
+    "edge": "79",
+    "firefox": "80",
+    "node": "13.2.0",
+    "opera": "60",
+    "opera_mobile": "51",
+    "safari": "14.1",
+    "ios": "14.5",
+    "samsung": "11.0",
+    "android": "72",
+    "electron": "5.0"
+  },
+  "proposal-export-namespace-from": {
+    "chrome": "72",
+    "deno": "1.0",
+    "edge": "79",
+    "firefox": "80",
+    "node": "13.2.0",
+    "opera": "60",
+    "opera_mobile": "51",
+    "safari": "14.1",
+    "ios": "14.5",
+    "samsung": "11.0",
+    "android": "72",
+    "electron": "5.0"
+  }
+}

capabilities/testdrive-jsui/node_modules/@babel/compat-data/native-modules.js

@@ -0,0 +1,2 @@
+// Todo (Babel 8): remove this file, in Babel 8 users import the .json directly
+module.exports = require("./data/native-modules.json");

capabilities/testdrive-jsui/node_modules/@babel/compat-data/overlapping-plugins.js

@@ -0,0 +1,2 @@
+// Todo (Babel 8): remove this file, in Babel 8 users import the .json directly
+module.exports = require("./data/overlapping-plugins.json");

capabilities/testdrive-jsui/node_modules/@babel/compat-data/package.json

@@ -0,0 +1,40 @@
+{
+  "name": "@babel/compat-data",
+  "version": "7.28.5",
+  "author": "The Babel Team (https://babel.dev/team)",
+  "license": "MIT",
+  "description": "The compat-data to determine required Babel plugins",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/babel/babel.git",
+    "directory": "packages/babel-compat-data"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "exports": {
+    "./plugins": "./plugins.js",
+    "./native-modules": "./native-modules.js",
+    "./corejs2-built-ins": "./corejs2-built-ins.js",
+    "./corejs3-shipped-proposals": "./corejs3-shipped-proposals.js",
+    "./overlapping-plugins": "./overlapping-plugins.js",
+    "./plugin-bugfixes": "./plugin-bugfixes.js"
+  },
+  "scripts": {
+    "build-data": "./scripts/download-compat-table.sh && node ./scripts/build-data.mjs && node ./scripts/build-modules-support.mjs && node ./scripts/build-bugfixes-targets.mjs"
+  },
+  "keywords": [
+    "babel",
+    "compat-table",
+    "compat-data"
+  ],
+  "devDependencies": {
+    "@mdn/browser-compat-data": "^6.0.8",
+    "core-js-compat": "^3.43.0",
+    "electron-to-chromium": "^1.5.140"
+  },
+  "engines": {
+    "node": ">=6.9.0"
+  },
+  "type": "commonjs"
+}

capabilities/testdrive-jsui/node_modules/@babel/compat-data/plugin-bugfixes.js

@@ -0,0 +1,2 @@
+// Todo (Babel 8): remove this file, in Babel 8 users import the .json directly
+module.exports = require("./data/plugin-bugfixes.json");

capabilities/testdrive-jsui/node_modules/@babel/compat-data/plugins.js

@@ -0,0 +1,2 @@
+// Todo (Babel 8): remove this file, in Babel 8 users import the .json directly
+module.exports = require("./data/plugins.json");

capabilities/testdrive-jsui/node_modules/@babel/core/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2014-present Sebastian McKenzie and other contributors
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

capabilities/testdrive-jsui/node_modules/@babel/core/README.md

@@ -0,0 +1,19 @@
+# @babel/core
+
+> Babel compiler core.
+
+See our website [@babel/core](https://babeljs.io/docs/babel-core) for more information or the [issues](https://github.com/babel/babel/issues?utf8=%E2%9C%93&q=is%3Aissue+label%3A%22pkg%3A%20core%22+is%3Aopen) associated with this package.
+
+## Install
+
+Using npm:
+
+```sh
+npm install --save-dev @babel/core
+```
+
+or using yarn:
+
+```sh
+yarn add @babel/core --dev
+```

capabilities/testdrive-jsui/node_modules/@babel/core/package.json

@@ -0,0 +1,82 @@
+{
+  "name": "@babel/core",
+  "version": "7.28.5",
+  "description": "Babel compiler core.",
+  "main": "./lib/index.js",
+  "author": "The Babel Team (https://babel.dev/team)",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/babel/babel.git",
+    "directory": "packages/babel-core"
+  },
+  "homepage": "https://babel.dev/docs/en/next/babel-core",
+  "bugs": "https://github.com/babel/babel/issues?utf8=%E2%9C%93&q=is%3Aissue+label%3A%22pkg%3A%20core%22+is%3Aopen",
+  "keywords": [
+    "6to5",
+    "babel",
+    "classes",
+    "const",
+    "es6",
+    "harmony",
+    "let",
+    "modules",
+    "transpile",
+    "transpiler",
+    "var",
+    "babel-core",
+    "compiler"
+  ],
+  "engines": {
+    "node": ">=6.9.0"
+  },
+  "funding": {
+    "type": "opencollective",
+    "url": "https://opencollective.com/babel"
+  },
+  "browser": {
+    "./lib/config/files/index.js": "./lib/config/files/index-browser.js",
+    "./lib/config/resolve-targets.js": "./lib/config/resolve-targets-browser.js",
+    "./lib/transform-file.js": "./lib/transform-file-browser.js",
+    "./src/config/files/index.ts": "./src/config/files/index-browser.ts",
+    "./src/config/resolve-targets.ts": "./src/config/resolve-targets-browser.ts",
+    "./src/transform-file.ts": "./src/transform-file-browser.ts"
+  },
+  "dependencies": {
+    "@babel/code-frame": "^7.27.1",
+    "@babel/generator": "^7.28.5",
+    "@babel/helper-compilation-targets": "^7.27.2",
+    "@babel/helper-module-transforms": "^7.28.3",
+    "@babel/helpers": "^7.28.4",
+    "@babel/parser": "^7.28.5",
+    "@babel/template": "^7.27.2",
+    "@babel/traverse": "^7.28.5",
+    "@babel/types": "^7.28.5",
+    "@jridgewell/remapping": "^2.3.5",
+    "convert-source-map": "^2.0.0",
+    "debug": "^4.1.0",
+    "gensync": "^1.0.0-beta.2",
+    "json5": "^2.2.3",
+    "semver": "^6.3.1"
+  },
+  "devDependencies": {
+    "@babel/helper-transform-fixture-test-runner": "^7.28.5",
+    "@babel/plugin-syntax-flow": "^7.27.1",
+    "@babel/plugin-transform-flow-strip-types": "^7.27.1",
+    "@babel/plugin-transform-modules-commonjs": "^7.27.1",
+    "@babel/preset-env": "^7.28.5",
+    "@babel/preset-typescript": "^7.28.5",
+    "@jridgewell/trace-mapping": "^0.3.28",
+    "@types/convert-source-map": "^2.0.0",
+    "@types/debug": "^4.1.0",
+    "@types/resolve": "^1.3.2",
+    "@types/semver": "^5.4.0",
+    "rimraf": "^3.0.0",
+    "ts-node": "^11.0.0-beta.1",
+    "tsx": "^4.20.3"
+  },
+  "type": "commonjs"
+}

capabilities/testdrive-jsui/node_modules/@babel/core/src/config/files/index-browser.ts

@@ -0,0 +1,115 @@
+/* c8 ignore start */
+
+import type { Handler } from "gensync";
+
+import type {
+  ConfigFile,
+  IgnoreFile,
+  RelativeConfig,
+  FilePackageData,
+} from "./types.ts";
+
+import type { CallerMetadata } from "../validation/options.ts";
+
+export type { ConfigFile, IgnoreFile, RelativeConfig, FilePackageData };
+
+export function findConfigUpwards(
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  rootDir: string,
+): string | null {
+  return null;
+}
+
+// eslint-disable-next-line require-yield
+export function* findPackageData(filepath: string): Handler<FilePackageData> {
+  return {
+    filepath,
+    directories: [],
+    pkg: null,
+    isPackage: false,
+  };
+}
+
+// eslint-disable-next-line require-yield
+export function* findRelativeConfig(
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  pkgData: FilePackageData,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  envName: string,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  caller: CallerMetadata | undefined,
+): Handler<RelativeConfig> {
+  return { config: null, ignore: null };
+}
+
+// eslint-disable-next-line require-yield
+export function* findRootConfig(
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  dirname: string,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  envName: string,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  caller: CallerMetadata | undefined,
+): Handler<ConfigFile | null> {
+  return null;
+}
+
+// eslint-disable-next-line require-yield
+export function* loadConfig(
+  name: string,
+  dirname: string,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  envName: string,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  caller: CallerMetadata | undefined,
+): Handler<ConfigFile> {
+  throw new Error(`Cannot load ${name} relative to ${dirname} in a browser`);
+}
+
+// eslint-disable-next-line require-yield
+export function* resolveShowConfigPath(
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  dirname: string,
+): Handler<string | null> {
+  return null;
+}
+
+export const ROOT_CONFIG_FILENAMES: string[] = [];
+
+type Resolved =
+  | { loader: "require"; filepath: string }
+  | { loader: "import"; filepath: string };
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export function resolvePlugin(name: string, dirname: string): Resolved | null {
+  return null;
+}
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export function resolvePreset(name: string, dirname: string): Resolved | null {
+  return null;
+}
+
+export function loadPlugin(
+  name: string,
+  dirname: string,
+): Handler<{
+  filepath: string;
+  value: unknown;
+}> {
+  throw new Error(
+    `Cannot load plugin ${name} relative to ${dirname} in a browser`,
+  );
+}
+
+export function loadPreset(
+  name: string,
+  dirname: string,
+): Handler<{
+  filepath: string;
+  value: unknown;
+}> {
+  throw new Error(
+    `Cannot load preset ${name} relative to ${dirname} in a browser`,
+  );
+}

capabilities/testdrive-jsui/node_modules/@babel/core/src/config/files/index.ts

@@ -0,0 +1,29 @@
+type indexBrowserType = typeof import("./index-browser");
+type indexType = typeof import("./index");
+
+// Kind of gross, but essentially asserting that the exports of this module are the same as the
+// exports of index-browser, since this file may be replaced at bundle time with index-browser.
+({}) as any as indexBrowserType as indexType;
+
+export { findPackageData } from "./package.ts";
+
+export {
+  findConfigUpwards,
+  findRelativeConfig,
+  findRootConfig,
+  loadConfig,
+  resolveShowConfigPath,
+  ROOT_CONFIG_FILENAMES,
+} from "./configuration.ts";
+export type {
+  ConfigFile,
+  IgnoreFile,
+  RelativeConfig,
+  FilePackageData,
+} from "./types.ts";
+export {
+  loadPlugin,
+  loadPreset,
+  resolvePlugin,
+  resolvePreset,
+} from "./plugins.ts";

capabilities/testdrive-jsui/node_modules/@babel/core/src/config/resolve-targets-browser.ts

@@ -0,0 +1,42 @@
+/* c8 ignore start */
+
+import type { InputOptions } from "./validation/options.ts";
+import getTargets, {
+  type InputTargets,
+} from "@babel/helper-compilation-targets";
+
+import type { Targets } from "@babel/helper-compilation-targets";
+
+export function resolveBrowserslistConfigFile(
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  browserslistConfigFile: string,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  configFilePath: string,
+): string | void {
+  return undefined;
+}
+
+export function resolveTargets(
+  options: InputOptions,
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  root: string,
+): Targets {
+  const optTargets = options.targets;
+  let targets: InputTargets;
+
+  if (typeof optTargets === "string" || Array.isArray(optTargets)) {
+    targets = { browsers: optTargets };
+  } else if (optTargets) {
+    if ("esmodules" in optTargets) {
+      targets = { ...optTargets, esmodules: "intersect" };
+    } else {
+      // https://github.com/microsoft/TypeScript/issues/17002
+      targets = optTargets as InputTargets;
+    }
+  }
+
+  return getTargets(targets, {
+    ignoreBrowserslistConfig: true,
+    browserslistEnv: options.browserslistEnv,
+  });
+}

capabilities/testdrive-jsui/node_modules/@babel/core/src/config/resolve-targets.ts

@@ -0,0 +1,53 @@
+type browserType = typeof import("./resolve-targets-browser");
+type nodeType = typeof import("./resolve-targets");
+
+// Kind of gross, but essentially asserting that the exports of this module are the same as the
+// exports of index-browser, since this file may be replaced at bundle time with index-browser.
+({}) as any as browserType as nodeType;
+
+import type { InputOptions } from "./validation/options.ts";
+import path from "node:path";
+import getTargets, {
+  type InputTargets,
+} from "@babel/helper-compilation-targets";
+
+import type { Targets } from "@babel/helper-compilation-targets";
+
+export function resolveBrowserslistConfigFile(
+  browserslistConfigFile: string,
+  configFileDir: string,
+): string | undefined {
+  return path.resolve(configFileDir, browserslistConfigFile);
+}
+
+export function resolveTargets(options: InputOptions, root: string): Targets {
+  const optTargets = options.targets;
+  let targets: InputTargets;
+
+  if (typeof optTargets === "string" || Array.isArray(optTargets)) {
+    targets = { browsers: optTargets };
+  } else if (optTargets) {
+    if ("esmodules" in optTargets) {
+      targets = { ...optTargets, esmodules: "intersect" };
+    } else {
+      // https://github.com/microsoft/TypeScript/issues/17002
+      targets = optTargets as InputTargets;
+    }
+  }
+
+  const { browserslistConfigFile } = options;
+  let configFile;
+  let ignoreBrowserslistConfig = false;
+  if (typeof browserslistConfigFile === "string") {
+    configFile = browserslistConfigFile;
+  } else {
+    ignoreBrowserslistConfig = browserslistConfigFile === false;
+  }
+
+  return getTargets(targets, {
+    ignoreBrowserslistConfig,
+    configFile,
+    configPath: root,
+    browserslistEnv: options.browserslistEnv,
+  });
+}

capabilities/testdrive-jsui/node_modules/@babel/core/src/transform-file-browser.ts

@@ -0,0 +1,33 @@
+/* c8 ignore start */
+
+// duplicated from transform-file so we do not have to import anything here
+type TransformFile = {
+  (filename: string, callback: (error: Error, file: null) => void): void;
+  (
+    filename: string,
+    opts: any,
+    callback: (error: Error, file: null) => void,
+  ): void;
+};
+
+export const transformFile: TransformFile = function transformFile(
+  filename,
+  opts,
+  callback?: (error: Error, file: null) => void,
+) {
+  if (typeof opts === "function") {
+    callback = opts;
+  }
+
+  callback(new Error("Transforming files is not supported in browsers"), null);
+};
+
+export function transformFileSync(): never {
+  throw new Error("Transforming files is not supported in browsers");
+}
+
+export function transformFileAsync() {
+  return Promise.reject(
+    new Error("Transforming files is not supported in browsers"),
+  );
+}

capabilities/testdrive-jsui/node_modules/@babel/core/src/transform-file.ts

@@ -0,0 +1,55 @@
+import gensync, { type Handler } from "gensync";
+
+import loadConfig from "./config/index.ts";
+import type { InputOptions, ResolvedConfig } from "./config/index.ts";
+import { run } from "./transformation/index.ts";
+import type { FileResult, FileResultCallback } from "./transformation/index.ts";
+import * as fs from "./gensync-utils/fs.ts";
+
+type transformFileBrowserType = typeof import("./transform-file-browser");
+type transformFileType = typeof import("./transform-file");
+
+// Kind of gross, but essentially asserting that the exports of this module are the same as the
+// exports of transform-file-browser, since this file may be replaced at bundle time with
+// transform-file-browser.
+({}) as any as transformFileBrowserType as transformFileType;
+
+const transformFileRunner = gensync(function* (
+  filename: string,
+  opts?: InputOptions,
+): Handler<FileResult | null> {
+  const options = { ...opts, filename };
+
+  const config: ResolvedConfig | null = yield* loadConfig(options);
+  if (config === null) return null;
+
+  const code = yield* fs.readFile(filename, "utf8");
+  return yield* run(config, code);
+});
+
+// @ts-expect-error TS doesn't detect that this signature is compatible
+export function transformFile(
+  filename: string,
+  callback: FileResultCallback,
+): void;
+export function transformFile(
+  filename: string,
+  opts: InputOptions | undefined | null,
+  callback: FileResultCallback,
+): void;
+export function transformFile(
+  ...args: Parameters<typeof transformFileRunner.errback>
+) {
+  transformFileRunner.errback(...args);
+}
+
+export function transformFileSync(
+  ...args: Parameters<typeof transformFileRunner.sync>
+) {
+  return transformFileRunner.sync(...args);
+}
+export function transformFileAsync(
+  ...args: Parameters<typeof transformFileRunner.async>
+) {
+  return transformFileRunner.async(...args);
+}

capabilities/testdrive-jsui/node_modules/@babel/generator/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2014-present Sebastian McKenzie and other contributors
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

capabilities/testdrive-jsui/node_modules/@babel/generator/README.md

@@ -0,0 +1,19 @@
+# @babel/generator
+
+> Turns an AST into code.
+
+See our website [@babel/generator](https://babeljs.io/docs/babel-generator) for more information or the [issues](https://github.com/babel/babel/issues?utf8=%E2%9C%93&q=is%3Aissue+label%3A%22pkg%3A%20generator%22+is%3Aopen) associated with this package.
+
+## Install
+
+Using npm:
+
+```sh
+npm install --save-dev @babel/generator
+```
+
+or using yarn:
+
+```sh
+yarn add @babel/generator --dev
+```

capabilities/testdrive-jsui/node_modules/@babel/generator/package.json

@@ -0,0 +1,39 @@
+{
+  "name": "@babel/generator",
+  "version": "7.28.5",
+  "description": "Turns an AST into code.",
+  "author": "The Babel Team (https://babel.dev/team)",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/babel/babel.git",
+    "directory": "packages/babel-generator"
+  },
+  "homepage": "https://babel.dev/docs/en/next/babel-generator",
+  "bugs": "https://github.com/babel/babel/issues?utf8=%E2%9C%93&q=is%3Aissue+label%3A%22pkg%3A%20generator%22+is%3Aopen",
+  "main": "./lib/index.js",
+  "files": [
+    "lib"
+  ],
+  "dependencies": {
+    "@babel/parser": "^7.28.5",
+    "@babel/types": "^7.28.5",
+    "@jridgewell/gen-mapping": "^0.3.12",
+    "@jridgewell/trace-mapping": "^0.3.28",
+    "jsesc": "^3.0.2"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.28.5",
+    "@babel/helper-fixtures": "^7.28.0",
+    "@babel/plugin-transform-typescript": "^7.28.5",
+    "@jridgewell/sourcemap-codec": "^1.5.3",
+    "charcodes": "^0.2.0"
+  },
+  "engines": {
+    "node": ">=6.9.0"
+  },
+  "type": "commonjs"
+}

capabilities/testdrive-jsui/node_modules/@babel/helper-annotate-as-pure/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2014-present Sebastian McKenzie and other contributors
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

capabilities/testdrive-jsui/node_modules/@babel/helper-annotate-as-pure/README.md

@@ -0,0 +1,19 @@
+# @babel/helper-annotate-as-pure
+
+> Helper function to annotate paths and nodes with #__PURE__ comment
+
+See our website [@babel/helper-annotate-as-pure](https://babeljs.io/docs/babel-helper-annotate-as-pure) for more information.
+
+## Install
+
+Using npm:
+
+```sh
+npm install --save @babel/helper-annotate-as-pure
+```
+
+or using yarn:
+
+```sh
+yarn add @babel/helper-annotate-as-pure
+```

capabilities/testdrive-jsui/node_modules/@babel/helper-annotate-as-pure/package.json

@@ -0,0 +1,27 @@
+{
+  "name": "@babel/helper-annotate-as-pure",
+  "version": "7.27.3",
+  "description": "Helper function to annotate paths and nodes with #__PURE__ comment",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/babel/babel.git",
+    "directory": "packages/babel-helper-annotate-as-pure"
+  },
+  "homepage": "https://babel.dev/docs/en/next/babel-helper-annotate-as-pure",
+  "license": "MIT",
+  "publishConfig": {
+    "access": "public"
+  },
+  "main": "./lib/index.js",
+  "dependencies": {
+    "@babel/types": "^7.27.3"
+  },
+  "devDependencies": {
+    "@babel/traverse": "^7.27.3"
+  },
+  "engines": {
+    "node": ">=6.9.0"
+  },
+  "author": "The Babel Team (https://babel.dev/team)",
+  "type": "commonjs"
+}

capabilities/testdrive-jsui/node_modules/@babel/helper-compilation-targets/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2014-present Sebastian McKenzie and other contributors
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

capabilities/testdrive-jsui/node_modules/@babel/helper-compilation-targets/README.md

@@ -0,0 +1,19 @@
+# @babel/helper-compilation-targets
+
+> Helper functions on Babel compilation targets
+
+See our website [@babel/helper-compilation-targets](https://babeljs.io/docs/babel-helper-compilation-targets) for more information.
+
+## Install
+
+Using npm:
+
+```sh
+npm install --save @babel/helper-compilation-targets
+```
+
+or using yarn:
+
+```sh
+yarn add @babel/helper-compilation-targets
+```

capabilities/testdrive-jsui/node_modules/@babel/helper-compilation-targets/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@babel/helper-compilation-targets",
+  "version": "7.27.2",
+  "author": "The Babel Team (https://babel.dev/team)",
+  "license": "MIT",
+  "description": "Helper functions on Babel compilation targets",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/babel/babel.git",
+    "directory": "packages/babel-helper-compilation-targets"
+  },
+  "main": "./lib/index.js",
+  "exports": {
+    ".": {
+      "types": "./lib/index.d.ts",
+      "default": "./lib/index.js"
+    },
+    "./package.json": "./package.json"
+  },
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "babel",
+    "babel-plugin"
+  ],
+  "dependencies": {
+    "@babel/compat-data": "^7.27.2",
+    "@babel/helper-validator-option": "^7.27.1",
+    "browserslist": "^4.24.0",
+    "lru-cache": "^5.1.1",
+    "semver": "^6.3.1"
+  },
+  "devDependencies": {
+    "@babel/helper-plugin-test-runner": "^7.27.1",
+    "@types/lru-cache": "^5.1.1",
+    "@types/semver": "^5.5.0"
+  },
+  "engines": {
+    "node": ">=6.9.0"
+  },
+  "type": "commonjs"
+}

capabilities/testdrive-jsui/node_modules/@babel/helper-create-class-features-plugin/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2014-present Sebastian McKenzie and other contributors
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

capabilities/testdrive-jsui/node_modules/@babel/helper-create-class-features-plugin/README.md

@@ -0,0 +1,19 @@
+# @babel/helper-create-class-features-plugin
+
+> Compile class public and private fields, private methods and decorators to ES6
+
+See our website [@babel/helper-create-class-features-plugin](https://babeljs.io/docs/babel-helper-create-class-features-plugin) for more information.
+
+## Install
+
+Using npm:
+
+```sh
+npm install --save @babel/helper-create-class-features-plugin
+```
+
+or using yarn:
+
+```sh
+yarn add @babel/helper-create-class-features-plugin
+```

capabilities/testdrive-jsui/node_modules/@babel/helper-create-class-features-plugin/package.json

@@ -0,0 +1,43 @@
+{
+  "name": "@babel/helper-create-class-features-plugin",
+  "version": "7.28.5",
+  "author": "The Babel Team (https://babel.dev/team)",
+  "license": "MIT",
+  "description": "Compile class public and private fields, private methods and decorators to ES6",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/babel/babel.git",
+    "directory": "packages/babel-helper-create-class-features-plugin"
+  },
+  "main": "./lib/index.js",
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "babel",
+    "babel-plugin"
+  ],
+  "dependencies": {
+    "@babel/helper-annotate-as-pure": "^7.27.3",
+    "@babel/helper-member-expression-to-functions": "^7.28.5",
+    "@babel/helper-optimise-call-expression": "^7.27.1",
+    "@babel/helper-replace-supers": "^7.27.1",
+    "@babel/helper-skip-transparent-expression-wrappers": "^7.27.1",
+    "@babel/traverse": "^7.28.5",
+    "semver": "^6.3.1"
+  },
+  "peerDependencies": {
+    "@babel/core": "^7.0.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.28.5",
+    "@babel/helper-plugin-test-runner": "^7.27.1",
+    "@babel/preset-env": "^7.28.5",
+    "@types/charcodes": "^0.2.0",
+    "charcodes": "^0.2.0"
+  },
+  "engines": {
+    "node": ">=6.9.0"
+  },
+  "type": "commonjs"
+}

capabilities/testdrive-jsui/node_modules/@babel/helper-create-regexp-features-plugin/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2014-present Sebastian McKenzie and other contributors
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

capabilities/testdrive-jsui/node_modules/@babel/helper-create-regexp-features-plugin/README.md

@@ -0,0 +1,19 @@
+# @babel/helper-create-regexp-features-plugin
+
+> Compile ESNext Regular Expressions to ES5
+
+See our website [@babel/helper-create-regexp-features-plugin](https://babeljs.io/docs/babel-helper-create-regexp-features-plugin) for more information.
+
+## Install
+
+Using npm:
+
+```sh
+npm install --save @babel/helper-create-regexp-features-plugin
+```
+
+or using yarn:
+
+```sh
+yarn add @babel/helper-create-regexp-features-plugin
+```

capabilities/testdrive-jsui/node_modules/@babel/helper-create-regexp-features-plugin/package.json

@@ -0,0 +1,36 @@
+{
+  "name": "@babel/helper-create-regexp-features-plugin",
+  "version": "7.28.5",
+  "author": "The Babel Team (https://babel.dev/team)",
+  "license": "MIT",
+  "description": "Compile ESNext Regular Expressions to ES5",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/babel/babel.git",
+    "directory": "packages/babel-helper-create-regexp-features-plugin"
+  },
+  "main": "./lib/index.js",
+  "publishConfig": {
+    "access": "public"
+  },
+  "keywords": [
+    "babel",
+    "babel-plugin"
+  ],
+  "dependencies": {
+    "@babel/helper-annotate-as-pure": "^7.27.3",
+    "regexpu-core": "^6.3.1",
+    "semver": "^6.3.1"
+  },
+  "peerDependencies": {
+    "@babel/core": "^7.0.0"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.28.5",
+    "@babel/helper-plugin-test-runner": "^7.27.1"
+  },
+  "engines": {
+    "node": ">=6.9.0"
+  },
+  "type": "commonjs"
+}

capabilities/testdrive-jsui/node_modules/@babel/helper-define-polyfill-provider/LICENSE

@@ -0,0 +1,22 @@
+MIT License
+
+Copyright (c) 2014-present Nicolò Ribaudo and other contributors
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+"Software"), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

capabilities/testdrive-jsui/node_modules/@babel/helper-define-polyfill-provider/README.md

@@ -0,0 +1,15 @@
+# @babel/helper-define-polyfill-provider
+
+## Install
+
+Using npm:
+
+```sh
+npm install --save-dev @babel/helper-define-polyfill-provider
+```
+
+or using yarn:
+
+```sh
+yarn add @babel/helper-define-polyfill-provider --dev
+```