Skip to content

fix: emit valid CSS for text shadows - #427

Open
Iams4kura wants to merge 1 commit into
GLips:mainfrom
Iams4kura:bugfix/emit-valid-text-shadow-css-20260912t040414z
Open

Iams4kura wants to merge 1 commit into
GLips:mainfrom
Iams4kura:bugfix/emit-valid-text-shadow-css-20260912t040414z

Conversation

@Iams4kura

Copy link
Copy Markdown

A Figma TEXT node with a drop shadow currently emits 2px 3px 4px 0px rgba(0, 0, 0, 0.5) as textShadow. Browsers reject the fourth length and compute text-shadow: none, so even an ordinary text drop shadow disappears when the returned CSS is used.

Text shadows now use the supported three-length form, 2px 3px 4px rgba(0, 0, 0, 0.5). Inner-shadow entries are omitted for TEXT nodes because inset invalidates the entire list, including otherwise valid drop shadows. Non-TEXT box shadows retain their spread and inset values; blur output is unchanged.

CSS text-shadow cannot represent Figma spread or inner shadows; this fix does not attempt to emulate either. The grammar is defined in CSS Text Decoration §4.

Validation:

  • Same regression tests on base c083d65c7e002923e7cb98f4e3bdafb105e90f6d: 5 failures before, all 9 effects tests pass after. Covers absent/zero/nonzero spread, mixed and inner-only shadows, hidden effects, multiple shadows, blur preservation, and box-shadow compatibility.
  • pnpm test: 256 passed, 1 skipped. The skipped test is the repository's opt-in live Figma integration test; no Figma account or design file was used.
  • pnpm type-check, pnpm lint, pnpm build, pnpm exec prettier --check "src/**/*.ts", and node scripts/scan-hidden-chars.mjs pass (Node 26.0.0, pnpm 10.10.0).
  • Chrome 147: CSS.supports("text-shadow", before) is false and the computed value is none; the actual transformed output after this fix is supported and renders a shadow. The non-TEXT computed box shadow is identical before and after.

Only the effects transformer and its tests change. No dependencies or generated files change.

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.

1 participant