Prerequisites
Describe the Feature Request
Stencil's JSX typings (JSXBase.HTMLAttributes in src/declarations/stencil-public-runtime.ts) include the standard global HTML attributes such as dir, lang, hidden, spellcheck, draggable, etc., but are missing the global translate attribute.
As a result, writing <p translate="no">…</p> in a Stencil component's render() fails type-checking with an error that translate is not a valid attribute, even though it is a valid global HTML attribute supported by every element.
Describe the Use Case
The translate="no" attribute is commonly used to tell browser/machine translation tools (e.g. Google Translate) not to translate certain content — for example brand/product names, prices, or codes that must remain verbatim. This is important for legal/branding correctness.
Describe Preferred Solution
Add translate to JSXBase.HTMLAttributes, alongside the other global attributes:
translate?: 'yes' | 'no' | (string & {});The 'yes' | 'no' literals provide autocomplete for the common values, while (string & {}) preserves that autocomplete without rejecting values that get widened to string.
Describe Alternatives
Spreading an untyped object literal, or module-augmenting @stencil/core/internal in the consuming project.
Additional Information
Branding is important for my company and we use this attribute a bunch to avoid translating silly product names. Currently we've patched stencil in our local repo to solve this.
Prerequisites
Describe the Feature Request
Stencil's JSX typings (
JSXBase.HTMLAttributesinsrc/declarations/stencil-public-runtime.ts) include the standard global HTML attributes such asdir,lang,hidden,spellcheck,draggable, etc., but are missing the globaltranslateattribute.As a result, writing
<p translate="no">…</p>in a Stencil component'srender()fails type-checking with an error thattranslateis not a valid attribute, even though it is a valid global HTML attribute supported by every element.Describe the Use Case
The
translate="no"attribute is commonly used to tell browser/machine translation tools (e.g. Google Translate) not to translate certain content — for example brand/product names, prices, or codes that must remain verbatim. This is important for legal/branding correctness.Describe Preferred Solution
Add
translatetoJSXBase.HTMLAttributes, alongside the other global attributes:The
'yes' | 'no'literals provide autocomplete for the common values, while(string & {})preserves that autocomplete without rejecting values that get widened tostring.Describe Alternatives
Spreading an untyped object literal, or module-augmenting
@stencil/core/internalin the consuming project.Additional Information
Branding is important for my company and we use this attribute a bunch to avoid translating silly product names. Currently we've patched stencil in our local repo to solve this.