Skip to content

fix: handle missing style container - #811

Open
nrps9909 wants to merge 1 commit into
react-component:masterfrom
nrps9909:codex/handle-missing-style-container
Open

fix: handle missing style container#811
nrps9909 wants to merge 1 commit into
react-component:masterfrom
nrps9909:codex/handle-missing-style-container

Conversation

@nrps9909

@nrps9909 nrps9909 commented Aug 28, 2026 •
edited by coderabbitai Bot
Loading

Copy link
Copy Markdown

Summary

  • return null when style injection runs during a transient document state with neither <head> nor <body>
  • guard the updateCSS, removal, and container-sync paths without changing insertion order for valid containers
  • cover both injectCSS and updateCSS with regressions that remove and then restore the document style containers

Closes #603.

Why a new fix

The older #455 exact head (903dfe1) still throws at container.appendChild(styleNode) for both public paths. It also skips insertion for prepend mode when a valid container is empty, because insertBefore(styleNode, null) was replaced with a conditional. This PR keeps the standard empty-container insertion behavior and returns early only when the container itself is absent. I left the exact-head reproduction details on #455.

Verification

  • regression on current master d1045f4: injectCSS fails at firstChild; updateCSS fails at children
  • regression on fix: add nullish in dynamicCSS.ts #455 exact head 903dfe1: both paths fail at appendChild
  • npm test -- --runInBand: 29 suites passed; 184 passed, 1 skipped
  • npm run tsc: passed
  • npm run lint: 0 errors, 13 pre-existing unused-disable warnings
  • git diff --check: passed

Overlap audit

#455 targets the same issue but is incomplete as described above. #809 also touches these two files for the independent Trusted Types textContent change; it does not address missing containers. This change can be rebased after either PR lands if needed.

AI assistance disclosure

Codex was used to trace the failure paths, audit overlapping open PRs, implement and run the regression tests, and draft this description. All reported failures and verification results were executed locally against the cited commits.

Summary by CodeRabbit

  • 错误修复
    • 改进样式处理在页面缺少可用容器时的稳定性。
    • 注入、更新或移除样式不会因容器不可用而抛出异常。
    • 同步占位样式失败时可安全终止操作。

@vercel

vercel Bot commented Aug 28, 2026

Copy link
Copy Markdown

@nrps9909 is attempting to deploy a commit to the afc163's projects Team on Vercel.

A member of the Team first needs to authorize it.

@coderabbitai

coderabbitai Bot commented Aug 28, 2026 •
edited
Loading

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: d60a01a0-f51c-4b1a-b5b9-6cc442188b5f

📥 Commits

Reviewing files that changed from the base of the PR and between d1045f4 and b1d5901.

📒 Files selected for processing (2)
  • src/Dom/dynamicCSS.ts
  • tests/dynamicCSS.test.tsx

Included review availability: Your plan provides up to 4 included reviews per hour; 3 remain after this review.

Walkthrough

本次变更为动态 CSS 操作增加空容器保护。findStyles、injectCSS 和 updateCSS 在容器缺失时安全返回，removeCSS 与 syncRealContainer 避免访问空节点。测试覆盖 head 和 body 同时缺失的场景。

Changes

动态 CSS 容器安全处理

Layer / File(s) Summary
容器与样式节点保护
src/Dom/dynamicCSS.ts		 当容器或新样式节点不可用时，相关函数返回空结果或提前结束。删除节点时使用可选链。
缺失容器测试
tests/dynamicCSS.test.tsx		 新增 injectCSS 和 updateCSS 测试，验证 head 与 body 缺失时返回 null、不抛出异常，并恢复 DOM。

Estimated code review effort: 2 (Simple) | ~10 minutes

Merge Risk: ⚪ Minimal · up to b1d59

This localized change makes CSS injection and removal tolerate transient documents without a head or body while preserving valid-container insertion behavior; no actionable merge-blocking risk remains after normal checks and review.

Poem

小兔守着样式门，
空容器来时不慌神。
找不到节点便停步，
测试确认无错误声。
DOM 修复如初春。

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name Status Explanation Resolution
Docstring Coverage ⚠️ Warning Docstring coverage is 33.33% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 6 functions across 2 files. Write docstrings for the functions missing them to satisfy the coverage threshold.
✅ Passed checks (4 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check ✅ Passed 标题“fix: handle missing style container”准确概括了本次变更的主要目的，即处理缺失的样式容器。
Linked Issues check ✅ Passed 代码在样式容器缺失时安全处理 findStyles、injectCSS、updateCSS、removeCSS 和 syncRealContainer，避免访问 null.children，并新增 injectCSS 与 updateCSS 的回归测试。变更满足问题 #603 的核心要求。
Out of Scope Changes check ✅ Passed 所有代码和测试变更都围绕缺失样式容器的安全处理展开。未发现与问题 #603 无关的代码变更。
  • Fix all pre-merge checks with AI
✨ Finishing Touches 💡 1
🛠️ Fix failing CI checks 💡
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests

Warning

Some tools did not complete. Review the errors below.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint install timed out. The project may have too many dependencies for the sandbox.

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

No reviews

Assignees

No one assigned

Labels

None yet

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

Cannot read properties of null (reading 'children') - dynamicCSS.ts

1 participant

@nrps9909