Skip to content

Migrate kg-mobiledoc-html-renderer to TypeScript#1795

Merged
kevinansfield merged 2 commits intomainfrom
ts/kg-mobiledoc-html-renderer
Mar 20, 2026
Merged

Migrate kg-mobiledoc-html-renderer to TypeScript#1795
kevinansfield merged 2 commits intomainfrom
ts/kg-mobiledoc-html-renderer

Conversation

@kevinansfield
Copy link
Member

Summary

  • Renames JS files to TS and migrates kg-mobiledoc-html-renderer to TypeScript
  • Adds tsconfig.test.json for test type-checking
  • Removes all any types and eslint-disable comments from test file
  • Fixes exports map (removes "node" condition), moduleResolutionNodeNext, tseslint.config()defineConfig()
  • Fixes overrides.ts typing with as unknown as pattern
  • Pins sinon to 21.0.3, typescript-eslint to 8.57.0

@coderabbitai
Copy link

coderabbitai bot commented Mar 20, 2026

Caution

Review failed

Pull request was closed or merged during review

Walkthrough

The PR migrates the kg-mobiledoc-html-renderer package from JavaScript/CommonJS to TypeScript/ESM with dual compiled outputs (build/esm and build/cjs). Changes include: converting source to .ts with typed exports, adding type declaration shims, new tsconfig files (including a CJS build config and test config), updating package.json to point to build outputs and an exports map, switching ESLint config to TypeScript, replacing JS tests with TS tests, adding test bootstrap overrides, and updating .gitignore and test utilities. The package now publishes compiled artifacts from build/.

Estimated code review effort

🎯 4 (Complex) | ⏱️ ~45 minutes

🚥 Pre-merge checks | ✅ 3
✅ Passed checks (3 passed)
Check name Status Explanation
Title check ✅ Passed The PR title 'Migrate kg-mobiledoc-html-renderer to TypeScript' clearly and concisely summarizes the main objective of the changeset.
Description check ✅ Passed The PR description is directly related to the changeset, providing details about TypeScript migration, config changes, and specific fixes applied to the package.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch ts/kg-mobiledoc-html-renderer
📝 Coding Plan
  • Generate coding plan for human review comments

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link

@coderabbitai coderabbitai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🧹 Nitpick comments (5)
packages/kg-mobiledoc-html-renderer/src/MobiledocHtmlRenderer.ts (2)

184-194: Type assertions bridge simple-dom's internal types.

The as unknown as SimpleDomNode double assertion on line 194 is a workaround for type incompatibility between simple-dom's internal types and the custom SimpleDomNode interface. This works but is fragile—if the actual simple-dom node shape differs from the interface, runtime errors could occur without compile-time warnings.

Consider documenting this coupling or adding a runtime check in development builds.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/kg-mobiledoc-html-renderer/src/MobiledocHtmlRenderer.ts` around
lines 184 - 194, The double cast "as unknown as SimpleDomNode" on
rendered.result is a fragile compile-time-only bridge between simple-dom
internals and our SimpleDomNode interface; replace it with a safer approach by
adding a runtime shape/assertion check in development and documenting the
coupling: implement a small dev-only validator that verifies rendered.result has
expected properties (e.g., tagName, childNodes, removeChild) before calling
modifier.modifyChildren(rendered.result), throw or log a descriptive error if
the shape is invalid, and add a comment near the DomModifier / SimpleDomNode
usage explaining the dependency on simple-dom internals; reference
SimpleDomNode, rendered.result, DomModifier and modifier.modifyChildren when
updating the code.

8-20: Consider using simple-dom's built-in type definitions instead of this custom interface.

The simple-dom package (v1.4.0) ships with its own TypeScript declarations in dist/types/index.d.ts. Rather than maintaining a custom SimpleDomNode interface, you could import and use the types exported directly from simple-dom to reduce code duplication and stay in sync with the library's API.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/kg-mobiledoc-html-renderer/src/MobiledocHtmlRenderer.ts` around
lines 8 - 20, Replace the custom SimpleDomNode interface with the official types
from the simple-dom package: remove the local interface declaration and import
the appropriate node/element types exported by simple-dom (e.g., the
Node/Element types) and use those in MobiledocHtmlRenderer method and property
signatures that currently reference SimpleDomNode so the renderer uses the
library-provided type declarations and stays in sync with simple-dom.
packages/kg-mobiledoc-html-renderer/test/MobiledocHtmlRenderer.test.ts (2)

55-56: Minor: Split chained statement for readability.

The combined statement with semicolon reduces readability.

♻️ Suggested formatting
-            p.appendChild(env.dom.createTextNode(options.testOption as string)); return p;
+            p.appendChild(env.dom.createTextNode(options.testOption as string));
+            return p;
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/kg-mobiledoc-html-renderer/test/MobiledocHtmlRenderer.test.ts`
around lines 55 - 56, The chained statement that creates a paragraph element,
appends a text node, and returns it should be split into separate statements for
clarity: first call env.dom.createElement('p') and assign to p (as currently
done), then call p.appendChild(env.dom.createTextNode(options.testOption as
string)) on its own line, and finally return p; update the code around the p
variable and the calls to env.dom.createElement, p.appendChild, and
env.dom.createTextNode to reflect this clearer, multi-line form.

4-24: Consider importing shared types from the source module.

The Mobiledoc interface duplicates the shape likely already defined in the source. If packages/kg-mobiledoc-html-renderer/src/MobiledocHtmlRenderer.ts exports this type, importing it would reduce duplication and keep types in sync.

🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/kg-mobiledoc-html-renderer/test/MobiledocHtmlRenderer.test.ts`
around lines 4 - 24, Replace the duplicated Mobiledoc and CardRenderArgs
interface declarations with imports from the renderer source: remove the local
interfaces and add imports for Mobiledoc (and CardRenderArgs if exported) from
the module that exports MobiledocHtmlRenderer (e.g., the
MobiledocHtmlRenderer.ts source), then update any test references to use the
imported types (Mobiledoc, CardRenderArgs) so types are shared and stay in sync
with the implementation.
packages/kg-mobiledoc-html-renderer/package.json (1)

19-21: Consider extracting duplicate build commands.

The same three commands (tsc && tsc -p tsconfig.cjs.json && echo '{\"type\":\"module\"}' > build/esm/package.json) are repeated in build, prepare, and pretest. Consider extracting to reduce duplication.

♻️ Proposed refactor
   "scripts": {
     "dev": "echo \"Implement me!\"",
-    "build": "tsc && tsc -p tsconfig.cjs.json && echo '{\"type\":\"module\"}' > build/esm/package.json",
-    "prepare": "tsc && tsc -p tsconfig.cjs.json && echo '{\"type\":\"module\"}' > build/esm/package.json",
-    "pretest": "tsc && tsc -p tsconfig.cjs.json && echo '{\"type\":\"module\"}' > build/esm/package.json && tsc -p tsconfig.test.json",
+    "build": "tsc && tsc -p tsconfig.cjs.json && echo '{\"type\":\"module\"}' > build/esm/package.json",
+    "prepare": "yarn build",
+    "pretest": "yarn build && tsc -p tsconfig.test.json",
🤖 Prompt for AI Agents
Verify each finding against the current code and only fix it if needed.

In `@packages/kg-mobiledoc-html-renderer/package.json` around lines 19 - 21, The
package.json repeats the same tsc + cjs + package.json creation command in the
"build", "prepare", and "pretest" scripts; extract that duplicated command into
a single reusable npm script (e.g., "build:all") and have "build", "prepare",
and "pretest" invoke "npm run build:all" instead. Ensure "pretest" still runs
the additional "tsc -p tsconfig.test.json" after the shared script (e.g., "npm
run build:all && tsc -p tsconfig.test.json"). Update the scripts entries
"build", "prepare", and "pretest" to reference the new "build:all" script name.
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.

Nitpick comments:
In `@packages/kg-mobiledoc-html-renderer/package.json`:
- Around line 19-21: The package.json repeats the same tsc + cjs + package.json
creation command in the "build", "prepare", and "pretest" scripts; extract that
duplicated command into a single reusable npm script (e.g., "build:all") and
have "build", "prepare", and "pretest" invoke "npm run build:all" instead.
Ensure "pretest" still runs the additional "tsc -p tsconfig.test.json" after the
shared script (e.g., "npm run build:all && tsc -p tsconfig.test.json"). Update
the scripts entries "build", "prepare", and "pretest" to reference the new
"build:all" script name.

In `@packages/kg-mobiledoc-html-renderer/src/MobiledocHtmlRenderer.ts`:
- Around line 184-194: The double cast "as unknown as SimpleDomNode" on
rendered.result is a fragile compile-time-only bridge between simple-dom
internals and our SimpleDomNode interface; replace it with a safer approach by
adding a runtime shape/assertion check in development and documenting the
coupling: implement a small dev-only validator that verifies rendered.result has
expected properties (e.g., tagName, childNodes, removeChild) before calling
modifier.modifyChildren(rendered.result), throw or log a descriptive error if
the shape is invalid, and add a comment near the DomModifier / SimpleDomNode
usage explaining the dependency on simple-dom internals; reference
SimpleDomNode, rendered.result, DomModifier and modifier.modifyChildren when
updating the code.
- Around line 8-20: Replace the custom SimpleDomNode interface with the official
types from the simple-dom package: remove the local interface declaration and
import the appropriate node/element types exported by simple-dom (e.g., the
Node/Element types) and use those in MobiledocHtmlRenderer method and property
signatures that currently reference SimpleDomNode so the renderer uses the
library-provided type declarations and stays in sync with simple-dom.

In `@packages/kg-mobiledoc-html-renderer/test/MobiledocHtmlRenderer.test.ts`:
- Around line 55-56: The chained statement that creates a paragraph element,
appends a text node, and returns it should be split into separate statements for
clarity: first call env.dom.createElement('p') and assign to p (as currently
done), then call p.appendChild(env.dom.createTextNode(options.testOption as
string)) on its own line, and finally return p; update the code around the p
variable and the calls to env.dom.createElement, p.appendChild, and
env.dom.createTextNode to reflect this clearer, multi-line form.
- Around line 4-24: Replace the duplicated Mobiledoc and CardRenderArgs
interface declarations with imports from the renderer source: remove the local
interfaces and add imports for Mobiledoc (and CardRenderArgs if exported) from
the module that exports MobiledocHtmlRenderer (e.g., the
MobiledocHtmlRenderer.ts source), then update any test references to use the
imported types (Mobiledoc, CardRenderArgs) so types are shared and stay in sync
with the implementation.

ℹ️ Review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: aa17cecc-68b0-4412-9ee0-66e32c10189f

📥 Commits

Reviewing files that changed from the base of the PR and between f606602 and ca0a288.

📒 Files selected for processing (16)
  • packages/kg-mobiledoc-html-renderer/.gitignore
  • packages/kg-mobiledoc-html-renderer/eslint.config.mjs
  • packages/kg-mobiledoc-html-renderer/index.js
  • packages/kg-mobiledoc-html-renderer/package.json
  • packages/kg-mobiledoc-html-renderer/src/MobiledocHtmlRenderer.ts
  • packages/kg-mobiledoc-html-renderer/src/index.ts
  • packages/kg-mobiledoc-html-renderer/src/types.d.ts
  • packages/kg-mobiledoc-html-renderer/test/MobiledocHtmlRenderer.test.js
  • packages/kg-mobiledoc-html-renderer/test/MobiledocHtmlRenderer.test.ts
  • packages/kg-mobiledoc-html-renderer/test/utils/assertions.ts
  • packages/kg-mobiledoc-html-renderer/test/utils/index.ts
  • packages/kg-mobiledoc-html-renderer/test/utils/overrides.js
  • packages/kg-mobiledoc-html-renderer/test/utils/overrides.ts
  • packages/kg-mobiledoc-html-renderer/tsconfig.cjs.json
  • packages/kg-mobiledoc-html-renderer/tsconfig.json
  • packages/kg-mobiledoc-html-renderer/tsconfig.test.json
💤 Files with no reviewable changes (3)
  • packages/kg-mobiledoc-html-renderer/index.js
  • packages/kg-mobiledoc-html-renderer/test/utils/overrides.js
  • packages/kg-mobiledoc-html-renderer/test/MobiledocHtmlRenderer.test.js

@codecov-commenter
Copy link

Codecov Report

❌ Patch coverage is 80.73394% with 21 lines in your changes missing coverage. Please review.
✅ Project coverage is 85.35%. Comparing base (f606602) to head (ca0a288).
⚠️ Report is 1 commits behind head on main.

Files with missing lines Patch % Lines
...kages/kg-mobiledoc-html-renderer/eslint.config.mjs 0.00% 19 Missing ⚠️
...biledoc-html-renderer/src/MobiledocHtmlRenderer.ts 98.87% 1 Missing ⚠️
packages/kg-mobiledoc-html-renderer/src/index.ts 0.00% 1 Missing ⚠️
Additional details and impacted files
@@            Coverage Diff             @@
##             main    #1795      +/-   ##
==========================================
+ Coverage   85.22%   85.35%   +0.13%     
==========================================
  Files         198      198              
  Lines       12979    13031      +52     
  Branches     1964     1970       +6     
==========================================
+ Hits        11061    11123      +62     
+ Misses       1905     1895      -10     
  Partials       13       13              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

- Move lib/ to src/, rename .js to .ts
- Add tsconfig.json (strict, NodeNext, ESM)
- Add "type": "module" to package.json
- Convert source and tests from CJS to ESM
- Add type annotations and type declaration files
- Replace .eslintrc.js with eslint.config.js (flat config)
- Output to build/ via tsc
@kevinansfield kevinansfield force-pushed the ts/kg-mobiledoc-html-renderer branch from ca0a288 to 3b0392a Compare March 20, 2026 13:48
@kevinansfield kevinansfield enabled auto-merge (rebase) March 20, 2026 13:49
@kevinansfield kevinansfield merged commit 358a77a into main Mar 20, 2026
2 of 3 checks passed
@kevinansfield kevinansfield deleted the ts/kg-mobiledoc-html-renderer branch March 20, 2026 13:54
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants