skills/angular__angular
1
0
Fork 0
mirror of https://github.com/angular/angular.git synced 2026-09-14 13:54:52 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(docs-infra): restore the xlf regions on the i18n guides

Browse Source 
#65848 renamed `messages.fr.xlf.html` to `messages.fr.xlf` and, in the same
lines, reverted `region=` back to `visibleRegion=`, undoing #65530 from two
weeks earlier. `visibleRegion` is not read by the tokenizer, and `xlf` is not
in `REGION_MATCHERS`, so both halves of the snippet handling broke at once.

Since then https://angular.dev/guide/i18n/translation-files has shown the same
78 line file ten times where the prose describes single `<trans-unit>`
elements, and https://angular.dev/guide/i18n/manage-marked-text three times,
each carrying the `#docregion` scaffolding into the rendered code.

Mapping `xlf` to the html matcher also cleans up
https://angular.dev/guide/i18n/example, which renders the whole file on purpose
but leaked 27 marker lines into it.

`docs-code.spec.mts` already loads this fixture but only asserted the block
existed, so it stayed green throughout. It now also asserts no marker survives.
This commit is contained in:
Kam
2026-09-06 02:07:10 +03:00
committed by Andrew Scott
parent 14dbbf9b68
commit 61b353ebee
5 changed files with 16 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
adev/shared-docs/pipeline/shared/marked/test/docs-code/docs-code.spec.mts
+1
View File
@@ -46,6 +46,7 @@ describe('markdown to html', () => {
it('should load header and html code', () => {
const codeBlock = markdownDocument.querySelectorAll('code')[3];
expect(codeBlock).toBeTruthy();
expect(codeBlock?.textContent).not.toContain('docregion');
});
it('should not link property names in object literals', () => {
adev/shared-docs/pipeline/shared/regions/region-parser.mts
+1
View File
@@ -27,6 +27,7 @@ const REGION_MATCHERS = {
es6: inlineC,
html: html,
svg: html,
xlf: html,
css: blockC,
conf: inlineHash,
yaml: inlineHash,
adev/shared-docs/pipeline/shared/regions/remove-eslint-comments.mts
+1
View File
@@ -13,6 +13,7 @@ export type FileType =
| 'es6'
| 'html'
| 'svg'
| 'xlf'
| 'css'
| 'conf'
| 'yaml'
adev/src/content/guide/i18n/manage-marked-text.md
+3 -3
View File
@@ -9,7 +9,7 @@ As described in [How meanings control text extraction and merges][GuideI18nCommo
The following example displays translation units with unique IDs.
<docs-code header="messages.fr.xlf" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="generated-id"/>
<docs-code header="messages.fr.xlf" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="generated-id"/>
When you change the translatable text, the extractor generates a new ID for that translation unit.
In most cases, changes in the source text also require a change to the translation.
@@ -34,7 +34,7 @@ variableText1 = $localize`:@@introductionHeader:Hello i18n!`;
When you specify a custom ID, the extractor generates a translation unit with the custom ID.
<docs-code header="messages.fr.xlf" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="custom-id"/>
<docs-code header="messages.fr.xlf" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="custom-id"/>
If you change the text, the extractor does not change the ID.
As a result, you don't have to take the extra step to update the translation.
@@ -75,7 +75,7 @@ For example, in the following code snippet the same `myId` custom ID is defined
The following displays the translation in French.
<docs-code header="src/locale/messages.fr.xlf" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="i18n-duplicate-custom-id"/>
<docs-code header="src/locale/messages.fr.xlf" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="i18n-duplicate-custom-id"/>
Both elements now use the same translation \(`Bonjour`\), because both were defined with the same custom ID.
adev/src/content/guide/i18n/translation-files.md
+10 -10
View File
@@ -132,20 +132,20 @@ The following actions describe the translation process for French.
1. Open `messages.fr.xlf` and find the first `<trans-unit>` element.
This is a _translation unit_, also known as a _text node_, that represents the translation of the `<h1>` greeting tag that was previously marked with the `i18n` attribute.
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="translated-hello-before"/>
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="translated-hello-before"/>
The `id="introductionHeader"` is a [custom ID][GuideI18nOptionalManageMarkedText], but without the `@@` prefix required in the source HTML.
1. Duplicate the `<source>... </source>` element in the text node, rename it to `target`, and then replace the content with the French text.
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>, after translation)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="translated-hello"/>
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>, after translation)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="translated-hello"/>
In a more complex translation, the information and context in the [description and meaning elements][GuideI18nCommonPrepareAddHelpfulDescriptionsAndMeanings] help you choose the right words for translation.
1. Translate the other text nodes.
The following example displays the way to translate.
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="translated-other-nodes"/>
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="translated-other-nodes"/>
IMPORTANT: Don't change the IDs for translation units.
Each `id` attribute is generated by Angular and depends on the content of the component text and the assigned meaning.
@@ -169,7 +169,7 @@ To translate a `plural`, translate the ICU format match values.
The following example displays the way to translate.
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="translated-plural"/>
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="translated-plural"/>
## Translate alternate expressions
@@ -184,18 +184,18 @@ The following example displays a `select` ICU expression in the component templa
In this example, Angular extracts the expression into two translation units.
The first contains the text outside of the `select` clause, and uses a placeholder for `select` \(`<x id="ICU">`\):
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="translate-select-1"/>
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="translate-select-1"/>
IMPORTANT: When you translate the text, move the placeholder if necessary, but don't remove it.
If you remove the placeholder, the ICU expression is removed from your translated application.
The following example displays the second translation unit that contains the `select` clause.
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="translate-select-2"/>
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="translate-select-2"/>
The following example displays both translation units after translation is complete.
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="translated-select"/>
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="translated-select"/>
## Translate nested expressions
@@ -206,15 +206,15 @@ Angular extracts the expression into two translation units.
The following example displays the first translation unit that contains the text outside of the nested expression.
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="translate-nested-1"/>
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="translate-nested-1"/>
The following example displays the second translation unit that contains the complete nested expression.
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="translate-nested-2"/>
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="translate-nested-2"/>
The following example displays both translation units after translating.
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" visibleRegion="translate-nested"/>
<docs-code header="src/locale/messages.fr.xlf (<trans-unit>)" path="adev/src/content/examples/i18n/doc-files/messages.fr.xlf" region="translate-nested"/>
## What's next