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/json-parse-even-better-errors/CHANGELOG.md

@@ -0,0 +1,50 @@
+# Change Log
+
+All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
+
+## 2.0.0
+
+* Add custom error classes
+
+<a name="1.0.2"></a>
+## [1.0.2](https://github.com/npm/json-parse-even-better-errors/compare/v1.0.1...v1.0.2) (2018-03-30)
+
+
+### Bug Fixes
+
+* **messages:** More friendly messages for non-string ([#1](https://github.com/npm/json-parse-even-better-errors/issues/1)) ([a476d42](https://github.com/npm/json-parse-even-better-errors/commit/a476d42))
+
+
+
+<a name="1.0.1"></a>
+## [1.0.1](https://github.com/npm/json-parse-even-better-errors/compare/v1.0.0...v1.0.1) (2017-08-16)
+
+
+### Bug Fixes
+
+* **license:** oops. Forgot to update license.md ([efe2958](https://github.com/npm/json-parse-even-better-errors/commit/efe2958))
+
+
+
+<a name="1.0.0"></a>
+# 1.0.0 (2017-08-15)
+
+
+### Features
+
+* **init:** Initial Commit ([562c977](https://github.com/npm/json-parse-even-better-errors/commit/562c977))
+
+
+### BREAKING CHANGES
+
+* **init:** This is the first commit!
+
+
+
+<a name="0.1.0"></a>
+# 0.1.0 (2017-08-15)
+
+
+### Features
+
+* **init:** Initial Commit ([9dd1a19](https://github.com/npm/json-parse-even-better-errors/commit/9dd1a19))

capabilities/testdrive-jsui/node_modules/json-parse-even-better-errors/LICENSE.md

@@ -0,0 +1,25 @@
+Copyright 2017 Kat Marchán
+Copyright npm, Inc.
+
+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.
+
+---
+
+This library is a fork of 'better-json-errors' by Kat Marchán, extended and
+distributed under the terms of the MIT license above.

capabilities/testdrive-jsui/node_modules/json-parse-even-better-errors/README.md

@@ -0,0 +1,96 @@
+# json-parse-even-better-errors
+
+[`json-parse-even-better-errors`](https://github.com/npm/json-parse-even-better-errors)
+is a Node.js library for getting nicer errors out of `JSON.parse()`,
+including context and position of the parse errors.
+
+It also preserves the newline and indentation styles of the JSON data, by
+putting them in the object or array in the `Symbol.for('indent')` and
+`Symbol.for('newline')` properties.
+
+## Install
+
+`$ npm install --save json-parse-even-better-errors`
+
+## Table of Contents
+
+* [Example](#example)
+* [Features](#features)
+* [Contributing](#contributing)
+* [API](#api)
+  * [`parse`](#parse)
+
+### Example
+
+```javascript
+const parseJson = require('json-parse-even-better-errors')
+
+parseJson('"foo"') // returns the string 'foo'
+parseJson('garbage') // more useful error message
+parseJson.noExceptions('garbage') // returns undefined
+```
+
+### Features
+
+* Like JSON.parse, but the errors are better.
+* Strips a leading byte-order-mark that you sometimes get reading files.
+* Has a `noExceptions` method that returns undefined rather than throwing.
+* Attaches the newline character(s) used to the `Symbol.for('newline')`
+  property on objects and arrays.
+* Attaches the indentation character(s) used to the `Symbol.for('indent')`
+  property on objects and arrays.
+
+## Indentation
+
+To preserve indentation when the file is saved back to disk, use
+`data[Symbol.for('indent')]` as the third argument to `JSON.stringify`, and
+if you want to preserve windows `\r\n` newlines, replace the `\n` chars in
+the string with `data[Symbol.for('newline')]`.
+
+For example:
+
+```js
+const txt = await readFile('./package.json', 'utf8')
+const data = parseJsonEvenBetterErrors(txt)
+const indent = Symbol.for('indent')
+const newline = Symbol.for('newline')
+// .. do some stuff to the data ..
+const string = JSON.stringify(data, null, data[indent]) + '\n'
+const eolFixed = data[newline] === '\n' ? string
+  : string.replace(/\n/g, data[newline])
+await writeFile('./package.json', eolFixed)
+```
+
+Indentation is determined by looking at the whitespace between the initial
+`{` and `[` and the character that follows it.  If you have lots of weird
+inconsistent indentation, then it won't track that or give you any way to
+preserve it.  Whether this is a bug or a feature is debatable ;)
+
+### API
+
+#### <a name="parse"></a> `parse(txt, reviver = null, context = 20)`
+
+Works just like `JSON.parse`, but will include a bit more information when
+an error happens, and attaches a `Symbol.for('indent')` and
+`Symbol.for('newline')` on objects and arrays.  This throws a
+`JSONParseError`.
+
+#### <a name="parse"></a> `parse.noExceptions(txt, reviver = null)`
+
+Works just like `JSON.parse`, but will return `undefined` rather than
+throwing an error.
+
+#### <a name="jsonparseerror"></a> `class JSONParseError(er, text, context = 20, caller = null)`
+
+Extends the JavaScript `SyntaxError` class to parse the message and provide
+better metadata.
+
+Pass in the error thrown by the built-in `JSON.parse`, and the text being
+parsed, and it'll parse out the bits needed to be helpful.
+
+`context` defaults to 20.
+
+Set a `caller` function to trim internal implementation details out of the
+stack trace.  When calling `parseJson`, this is set to the `parseJson`
+function.  If not set, then the constructor defaults to itself, so the
+stack trace will point to the spot where you call `new JSONParseError`.

capabilities/testdrive-jsui/node_modules/json-parse-even-better-errors/index.js

@@ -0,0 +1,121 @@
+'use strict'
+
+const hexify = char => {
+  const h = char.charCodeAt(0).toString(16).toUpperCase()
+  return '0x' + (h.length % 2 ? '0' : '') + h
+}
+
+const parseError = (e, txt, context) => {
+  if (!txt) {
+    return {
+      message: e.message + ' while parsing empty string',
+      position: 0,
+    }
+  }
+  const badToken = e.message.match(/^Unexpected token (.) .*position\s+(\d+)/i)
+  const errIdx = badToken ? +badToken[2]
+    : e.message.match(/^Unexpected end of JSON.*/i) ? txt.length - 1
+    : null
+
+  const msg = badToken ? e.message.replace(/^Unexpected token ./, `Unexpected token ${
+      JSON.stringify(badToken[1])
+    } (${hexify(badToken[1])})`)
+    : e.message
+
+  if (errIdx !== null && errIdx !== undefined) {
+    const start = errIdx <= context ? 0
+      : errIdx - context
+
+    const end = errIdx + context >= txt.length ? txt.length
+      : errIdx + context
+
+    const slice = (start === 0 ? '' : '...') +
+      txt.slice(start, end) +
+      (end === txt.length ? '' : '...')
+
+    const near = txt === slice ? '' : 'near '
+
+    return {
+      message: msg + ` while parsing ${near}${JSON.stringify(slice)}`,
+      position: errIdx,
+    }
+  } else {
+    return {
+      message: msg + ` while parsing '${txt.slice(0, context * 2)}'`,
+      position: 0,
+    }
+  }
+}
+
+class JSONParseError extends SyntaxError {
+  constructor (er, txt, context, caller) {
+    context = context || 20
+    const metadata = parseError(er, txt, context)
+    super(metadata.message)
+    Object.assign(this, metadata)
+    this.code = 'EJSONPARSE'
+    this.systemError = er
+    Error.captureStackTrace(this, caller || this.constructor)
+  }
+  get name () { return this.constructor.name }
+  set name (n) {}
+  get [Symbol.toStringTag] () { return this.constructor.name }
+}
+
+const kIndent = Symbol.for('indent')
+const kNewline = Symbol.for('newline')
+// only respect indentation if we got a line break, otherwise squash it
+// things other than objects and arrays aren't indented, so ignore those
+// Important: in both of these regexps, the $1 capture group is the newline
+// or undefined, and the $2 capture group is the indent, or undefined.
+const formatRE = /^\s*[{\[]((?:\r?\n)+)([\s\t]*)/
+const emptyRE = /^(?:\{\}|\[\])((?:\r?\n)+)?$/
+
+const parseJson = (txt, reviver, context) => {
+  const parseText = stripBOM(txt)
+  context = context || 20
+  try {
+    // get the indentation so that we can save it back nicely
+    // if the file starts with {" then we have an indent of '', ie, none
+    // otherwise, pick the indentation of the next line after the first \n
+    // If the pattern doesn't match, then it means no indentation.
+    // JSON.stringify ignores symbols, so this is reasonably safe.
+    // if the string is '{}' or '[]', then use the default 2-space indent.
+    const [, newline = '\n', indent = '  '] = parseText.match(emptyRE) ||
+      parseText.match(formatRE) ||
+      [, '', '']
+
+    const result = JSON.parse(parseText, reviver)
+    if (result && typeof result === 'object') {
+      result[kNewline] = newline
+      result[kIndent] = indent
+    }
+    return result
+  } catch (e) {
+    if (typeof txt !== 'string' && !Buffer.isBuffer(txt)) {
+      const isEmptyArray = Array.isArray(txt) && txt.length === 0
+      throw Object.assign(new TypeError(
+        `Cannot parse ${isEmptyArray ? 'an empty array' : String(txt)}`
+      ), {
+        code: 'EJSONPARSE',
+        systemError: e,
+      })
+    }
+
+    throw new JSONParseError(e, parseText, context, parseJson)
+  }
+}
+
+// Remove byte order marker. This catches EF BB BF (the UTF-8 BOM)
+// because the buffer-to-string conversion in `fs.readFileSync()`
+// translates it to FEFF, the UTF-16 BOM.
+const stripBOM = txt => String(txt).replace(/^\uFEFF/, '')
+
+module.exports = parseJson
+parseJson.JSONParseError = JSONParseError
+
+parseJson.noExceptions = (txt, reviver) => {
+  try {
+    return JSON.parse(stripBOM(txt), reviver)
+  } catch (e) {}
+}

capabilities/testdrive-jsui/node_modules/json-parse-even-better-errors/package.json

@@ -0,0 +1,33 @@
+{
+  "name": "json-parse-even-better-errors",
+  "version": "2.3.1",
+  "description": "JSON.parse with context information on error",
+  "main": "index.js",
+  "files": [
+    "*.js"
+  ],
+  "scripts": {
+    "preversion": "npm t",
+    "postversion": "npm publish",
+    "prepublishOnly": "git push --follow-tags",
+    "test": "tap",
+    "snap": "tap"
+  },
+  "repository": "https://github.com/npm/json-parse-even-better-errors",
+  "keywords": [
+    "JSON",
+    "parser"
+  ],
+  "author": {
+    "name": "Kat Marchán",
+    "email": "kzm@zkat.tech",
+    "twitter": "maybekatz"
+  },
+  "license": "MIT",
+  "devDependencies": {
+    "tap": "^14.6.5"
+  },
+  "tap": {
+    "check-coverage": true
+  }
+}