feat: add declarativeTemplate bridge#7492
Merged
janechu merged 3 commits intoreleases/fast-element-v3from Apr 24, 2026
Merged
Conversation
janechu
force-pushed
the
copilot/pr2-declarative-map-extensions
branch
from
e1d3d5f to
b6a60e1
Compare
janechu
force-pushed
the
copilot/pr3-declarative-template-bridge
branch
3 times, most recently
from
7136abc to
27e9651
Compare
janechu
force-pushed
the
copilot/pr2-declarative-map-extensions
branch
from
4cb9375 to
6d29bb7
Compare
janechu
force-pushed
the
copilot/pr3-declarative-template-bridge
branch
from
27e9651 to
48ab602
Compare
janechu
force-pushed
the
copilot/pr2-declarative-map-extensions
branch
from
6d29bb7 to
79a0f5a
Compare
janechu
force-pushed
the
copilot/pr3-declarative-template-bridge
branch
from
48ab602 to
bd5d9fd
Compare
5 tasks
janechu
force-pushed
the
copilot/pr2-declarative-map-extensions
branch
from
79a0f5a to
a4b11b8
Compare
janechu
force-pushed
the
copilot/pr3-declarative-template-bridge
branch
from
bd5d9fd to
9f05f56
Compare
janechu
force-pushed
the
copilot/pr2-declarative-map-extensions
branch
from
a4b11b8 to
15a202c
Compare
janechu
force-pushed
the
copilot/pr3-declarative-template-bridge
branch
from
9f05f56 to
85c2295
Compare
janechu
force-pushed
the
copilot/pr2-declarative-map-extensions
branch
from
15a202c to
9130dde
Compare
janechu
force-pushed
the
copilot/pr3-declarative-template-bridge
branch
from
85c2295 to
108f340
Compare
janechu
force-pushed
the
copilot/pr2-declarative-map-extensions
branch
from
9130dde to
5972d45
Compare
janechu
force-pushed
the
copilot/pr3-declarative-template-bridge
branch
from
108f340 to
cf5f14e
Compare
janechu
added a commit
that referenced
this pull request
Apr 24, 2026
# Pull Request ## 📖 Description Adds a new **Declarative HTML** documentation section to the 3.x docs site with four pages covering the full declarative template authoring workflow: - **Overview** — Purpose of declarative templates, when to use them, a hello world example, and comparison with imperative `html` tagged templates. - **Writing f-templates** — Template syntax including content/attribute/boolean/event bindings, directives (`f-when`, `f-repeat`, `f-ref`, `f-slotted`, `f-children`), dot-notation paths, execution context access (`$e`, `$c`), and expression limitations. - **Defining Elements** — `TemplateElement` registration, `templateOptions: "defer-and-hydrate"`, lifecycle callbacks (`config()`), element configuration (`options()`), `observerMap` and `attributeMap` usage. - **Server-Side Rendering** — The renderer-agnostic SSR contract, hydration flow, Declarative Shadow DOM output, state propagation, and `@microsoft/fast-build` CLI usage. Also adds cross-references from `packages/fast-element/README.md` and `DECLARATIVE_HTML.md` to the new docs. Based on the declarative template features from PRs #7490, #7491, #7492, and #7493. ## 📑 Test Plan - Website builds successfully with `npm run build -w sites/website` - All four pages render correctly in the 11ty output - `npm run checkchange` passes (no change files needed for docs-only changes to the website) ## ✅ Checklist ### General - [x] I have included a change request file using `$ npm run change` - [ ] I have added tests for my changes. - [x] I have tested my changes. - [x] I have updated the project documentation to reflect my changes. - [x] I have read the [CONTRIBUTING](https://github.com/microsoft/fast/blob/main/CONTRIBUTING.md) documentation and followed the [standards](https://github.com/microsoft/fast/blob/main/CODE_OF_CONDUCT.md#our-standards) for this project.
janechu
force-pushed
the
copilot/pr2-declarative-map-extensions
branch
from
5972d45 to
540ad04
Compare
Base automatically changed from
copilot/pr2-declarative-map-extensions
to
releases/fast-element-v3
April 24, 2026 21:31
Introduce declarativeTemplate() and a registry-aware f-template publication bridge so FASTElement definitions can wait for DOM-authored templates without manual TemplateElement setup while preserving the legacy defer-and-hydrate fallback. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
janechu
force-pushed
the
copilot/pr3-declarative-template-bridge
branch
from
cf5f14e to
1284755
Compare
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
chrisdholt
approved these changes
Apr 24, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Pull Request
📖 Description
This draft adds the public declarative template bridge so FAST elements can resolve DOM-authored
<f-template>markup directly fromtemplate: declarativeTemplate()without a manualTemplateElement.define()step.declarativeTemplate()on@microsoft/fast-element/declarative.js<f-template>bridge that waits for matching templates, handles template-first and definition-first ordering, and rejects duplicates clearlyTemplateElementas the component that parses markup, builds schema, applies map extensions, and creates the concreteViewTemplatetemplateOptions: "defer-and-hydrate"fallback👩💻 Reviewer Notes
The main review points are the registry/name bucket logic in
template-bridge.ts, the publication path inTemplateElement, and the error/compatibility handling around the retained legacy fallback.📑 Test Plan
npm run build -w @microsoft/fast-elementnpm run test:chromium -w @microsoft/fast-elementnpm run checkchangenpm run biome:checknpm run build:tsc -w @microsoft/fast-elementcd packages/fast-element && npx playwright test src/declarative/template-bridge.pw.spec.ts src/components/fast-definitions.pw.spec.ts src/components/fast-element.pw.spec.ts --project=chromium✅ Checklist
General
$ npm run change⏭ Next Steps
The remaining follow-up is entrypoint cleanup for
debug.js,declarative.js, andpolyfills.js, followed by flipping@microsoft/fast-elementto"sideEffects": false.