diff --git a/packages/localize/CHANGELOG.md b/packages/localize/CHANGELOG.md index 64fd07d88e..969dfc657b 100644 --- a/packages/localize/CHANGELOG.md +++ b/packages/localize/CHANGELOG.md @@ -26,6 +26,11 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - It is no longer necessary to provide a message `id`. When omitted, an id will be automatically generated from the string contents of the template. +### Fixed + +- `// msgdesc` descriptions are now correctly emitted as XLIFF `` + elements, instead of crashing. + ## [0.5.1] - 2020-11-09 ### Fixed diff --git a/packages/localize/README.md b/packages/localize/README.md index 1ebc1b400f..72b7bd6661 100644 --- a/packages/localize/README.md +++ b/packages/localize/README.md @@ -12,7 +12,7 @@ -###### [Features](#features) | [Overview](#overview) | [Modes](#modes) | [Tutorial](#tutorial) | [API](#api) | [Status event](#lit-localize-status-event) | [Localized mixin](#localized-mixin) | [CLI](#cli) | [Config file](#config-file) | [FAQ](#faq) +###### [Features](#features) | [Overview](#overview) | [Modes](#modes) | [Tutorial](#tutorial) | [API](#api) | [Descriptions](#descriptions) | [Status event](#lit-localize-status-event) | [Localized mixin](#localized-mixin) | [CLI](#cli) | [Config file](#config-file) | [FAQ](#faq) > @lit/localize is a library and command-line tool for localizing web > applications that are based on lit-html and LitElement. @@ -376,6 +376,49 @@ html`Hola ${getUsername()}!`; Name of the [`lit-localize-status`](#lit-localize-status-event) event. +## Descriptions + +You can add descriptions to messages using special `// msgdesc:` comments. +Message descriptions help translators understand the context of each string they +are translating. + +```ts +// msgdesc: Greeting to everybody on homepage +msg(html`Hello World!`); +``` + +Descriptions are represented in XLIFF using `` elements. + +```xml + + Greeting to everybody on homepage + Hello <b>World</b>! +World!`); + } +} +``` + +```xml + + Homepage / Greeting to everybody + Hello <b>World</b>! + +``` + ## `lit-localize-status` event In runtime mode, whenever a locale change starts, finishes successfully, or diff --git a/packages/localize/src/formatters/xliff.ts b/packages/localize/src/formatters/xliff.ts index e00d19a225..19d6798f51 100644 --- a/packages/localize/src/formatters/xliff.ts +++ b/packages/localize/src/formatters/xliff.ts @@ -250,9 +250,10 @@ export class XliffFormatter implements Formatter { if (descStack.length > 0) { // https://docs.oasis-open.org/xliff/v1.2/os/xliff-core.html#note - const note = document.createElement('note'); + const note = doc.createElement('note'); note.appendChild(doc.createTextNode(descStack.join(' / '))); transUnit.appendChild(note); + indent(transUnit, 1); } // https://docs.oasis-open.org/xliff/v1.2/os/xliff-core.html#source diff --git a/packages/localize/testdata/xliff/goldens/foo.ts b/packages/localize/testdata/xliff/goldens/foo.ts index 13a69da59d..62a7b06dd6 100644 --- a/packages/localize/testdata/xliff/goldens/foo.ts +++ b/packages/localize/testdata/xliff/goldens/foo.ts @@ -31,3 +31,14 @@ msg(`Hello World!`); msg((name) => `Hello ${name}!`, {args: ['Friend']}); msg(html`Hello World!`); msg((name) => html`Hello ${name}!`, {args: ['Friend']}); + +// msgdesc: Description of 0 +msg('described 0'); + +// msgdesc: Parent description +export function described() { + // msgdesc: Description of 1 + msg('described 1'); + // msgdesc: Description of 2 + msg('described 2'); +} diff --git a/packages/localize/testdata/xliff/goldens/tsout/es-419.ts b/packages/localize/testdata/xliff/goldens/tsout/es-419.ts index 7104cdb9d1..2fedfc1f06 100644 --- a/packages/localize/testdata/xliff/goldens/tsout/es-419.ts +++ b/packages/localize/testdata/xliff/goldens/tsout/es-419.ts @@ -23,4 +23,7 @@ export const templates = { ${x} y ${x}`, + as03c68d79ad36e8d4: `described 0`, + as03c68e79ad36ea87: `described 1`, + as03c68f79ad36ec3a: `described 2`, }; diff --git a/packages/localize/testdata/xliff/goldens/tsout/zh_CN.ts b/packages/localize/testdata/xliff/goldens/tsout/zh_CN.ts index 66d8e9c9bc..9022de1fb1 100644 --- a/packages/localize/testdata/xliff/goldens/tsout/zh_CN.ts +++ b/packages/localize/testdata/xliff/goldens/tsout/zh_CN.ts @@ -23,4 +23,7 @@ export const templates = { as00ad08ebae1e0f74: (name: any) => `Hello ${name}!`, ah3c44aff2d5f5ef6b: html`Hello World!`, ah82ccc38d4d46eaa9: (name: any) => html`Hello ${name}!`, + as03c68d79ad36e8d4: `described 0`, + as03c68e79ad36ea87: `described 1`, + as03c68f79ad36ec3a: `described 2`, }; diff --git a/packages/localize/testdata/xliff/goldens/xliff/es-419.xlf b/packages/localize/testdata/xliff/goldens/xliff/es-419.xlf index cf512cd16e..a5546333a3 100644 --- a/packages/localize/testdata/xliff/goldens/xliff/es-419.xlf +++ b/packages/localize/testdata/xliff/goldens/xliff/es-419.xlf @@ -48,6 +48,18 @@ Hello <b>${name}</b>! Hola <b>${name}</b>! + + Description of 0 + described 0 + + + Parent description / Description of 1 + described 1 + + + Parent description / Description of 2 + described 2 + diff --git a/packages/localize/testdata/xliff/goldens/xliff/zh_CN.xlf b/packages/localize/testdata/xliff/goldens/xliff/zh_CN.xlf index 1ed55b9b0a..e7a4abc5cc 100644 --- a/packages/localize/testdata/xliff/goldens/xliff/zh_CN.xlf +++ b/packages/localize/testdata/xliff/goldens/xliff/zh_CN.xlf @@ -39,6 +39,18 @@ Hello <b>${name}</b>! + + Description of 0 + described 0 + + + Parent description / Description of 1 + described 1 + + + Parent description / Description of 2 + described 2 + diff --git a/packages/localize/testdata/xliff/input/foo.ts b/packages/localize/testdata/xliff/input/foo.ts index 13a69da59d..62a7b06dd6 100644 --- a/packages/localize/testdata/xliff/input/foo.ts +++ b/packages/localize/testdata/xliff/input/foo.ts @@ -31,3 +31,14 @@ msg(`Hello World!`); msg((name) => `Hello ${name}!`, {args: ['Friend']}); msg(html`Hello World!`); msg((name) => html`Hello ${name}!`, {args: ['Friend']}); + +// msgdesc: Description of 0 +msg('described 0'); + +// msgdesc: Parent description +export function described() { + // msgdesc: Description of 1 + msg('described 1'); + // msgdesc: Description of 2 + msg('described 2'); +}