Socket
Socket
Sign inDemoInstall

@fluent/dom

Package Overview
Dependencies
1
Maintainers
4
Versions
6
Alerts
File Explorer

Advanced tools

npm Scripts
License

Install Socket

Detect and block malicious and high-risk dependencies

Install

Comparing version 0.8.1 to 0.9.0

116

CHANGELOG.md
# Changelog
## [0.9.0](https://github.com/projectfluent/fluent.js/compare/@fluent/dom@0.8.1...@fluent/dom@0.9.0) (2023-03-13)
- Drop Node.js v12 support, add v18 & latest to CI tests
([#607](https://github.com/projectfluent/fluent.js/pull/607))
- Use `/** comments */` where appropriate
## [@fluent/dom 0.8.1](https://github.com/projectfluent/fluent.js/compare/@fluent/dom@0.8.0...@fluent/dom@0.8.1) (2021-12-21)
- Add `.js` extension to imports
([#581](https://github.com/projectfluent/fluent.js/pull/581))
- Add `.js` extension to imports
([#581](https://github.com/projectfluent/fluent.js/pull/581))
## @fluent/dom 0.8.0 (September 13, 2021)
- Remove `"type": "commonjs"` from the package's root `package.json`.
([#556](https://github.com/projectfluent/fluent.js/pull/556))
- Set Node.js 12 as the minimum supported version
([#557](https://github.com/projectfluent/fluent.js/pull/557))
- Remove `"type": "commonjs"` from the package's root `package.json`.
([#556](https://github.com/projectfluent/fluent.js/pull/556))
- Set Node.js 12 as the minimum supported version
([#557](https://github.com/projectfluent/fluent.js/pull/557))
## @fluent/dom 0.7.0 (July 2, 2020)
- Remove the `compat.js` build and compile everything to ES2018. (#472, #474)
- Remove the `compat.js` build and compile everything to ES2018. (#472, #474)
The source code is now compiled by the TypeScript's compiler, `tsc`, to
ES2018 files in the `esm/` directory. These files are then bundled into a
single `index.js` UMD file without any further transpilation.
The source code is now compiled by the TypeScript's compiler, `tsc`, to
ES2018 files in the `esm/` directory. These files are then bundled into a
single `index.js` UMD file without any further transpilation.
The `compat.js` build (available as `@fluent/dom/compat`) was removed.
Please use your own transpilation pipeline if ES2018 is too recent for
your project.
The `compat.js` build (available as `@fluent/dom/compat`) was removed.
Please use your own transpilation pipeline if ES2018 is too recent for
your project.
Refer to https://github.com/projectfluent/fluent.js/wiki/Compatibility
for more information
Refer to https://github.com/projectfluent/fluent.js/wiki/Compatibility
for more information
## @fluent/dom 0.6.0 (August 21, 2019)
- Update `@fluent/dom` to work with `@fluent/bundle` 0.14
- Update `@fluent/dom` to work with `@fluent/bundle` 0.14
## @fluent/dom 0.5.0 (July 25, 2019)
- Rename `fluent-dom` to `@fluent/dom`.
- Rename `fluent-dom` to `@fluent/dom`.
## fluent-dom 0.5.0 (July 25, 2019)
- Deprecate `fluent-dom` in favor of `@fluent/dom`.
- Deprecate `fluent-dom` in favor of `@fluent/dom`.
## fluent-dom 0.4.2
- Minimize attribute churn when retranslating DOM Overlays (#354)
- Minor DOMOverlays alignments with the Gecko implementation.
- fix SyntaxError on Edge (#405)
- Minimize attribute churn when retranslating DOM Overlays (#354)
- Minor DOMOverlays alignments with the Gecko implementation.
- fix SyntaxError on Edge (#405)
## fluent-dom 0.4.1
- Package dist files.
- Package dist files.
## fluent-dom 0.4.0
- Drop support for IE and old evergreen browsers. (#133)
- Drop support for IE and old evergreen browsers. (#133)
Currently supported are: Firefox 52+, Chrome 55+, Edge 15+, Safari 10.1+,
iOS Safari 10.3+ and node 8.9+.
Currently supported are: Firefox 52+, Chrome 55+, Edge 15+, Safari 10.1+,
iOS Safari 10.3+ and node 8.9+.
- Add the `cached-iterable` runtime dependency.
- Add the `cached-iterable` runtime dependency.
`CachedAsyncIterable` is now available from its own package rather than
from the `fluent` package.
`CachedAsyncIterable` is now available from its own package rather than
from the `fluent` package.
- Modify the constructor to not require `window `element to be passed.
- Modify the constructor to not require `window `element to be passed.
## fluent-dom 0.3.0
- Refactor the overlay sanitization methods into separate functions. (#189)
- Separate out CachedIterable and CachedAsyncIterable, and add a param to touchNext. (#191)
- Localization.formatValues should accept an array of objects. (#198)
- Allow adding and removing resource Ids from a Localization. (#197)
- Refactor the overlay sanitization methods into separate functions. (#189)
- Separate out CachedIterable and CachedAsyncIterable, and add a param to touchNext. (#191)
- Localization.formatValues should accept an array of objects. (#198)
- Allow adding and removing resource Ids from a Localization. (#197)
## fluent-dom 0.2.0
- DOM Overlays v2 (#168)
Major refactor of DOM Overlays allowing developers to provide node elements as attributes.
- Refactored error reporting (#160)
- Fixed a minor bug which caused an extranous retranslation when `data-l10n-id` was
being removed from an element.
- DOM Overlays v2 (#168)
Major refactor of DOM Overlays allowing developers to provide node elements as attributes.
- Refactored error reporting (#160)
- Fixed a minor bug which caused an extranous retranslation when `data-l10n-id` was
being removed from an element.
## fluent-dom 0.1.0
- Extend formatWithFallback to accept async iterator (#46)
- Documented all methods
- Removed `DOMLocalization.prototype.translateRoot` method
- Simplified initial version of DOM Overlays (to be extended in 0.2) (#71)
- Only children of the white-listed types are allowed now. It's not possible
anymore to put elements of other types in the source HTML to make exceptions.
- The identity of the source element's children is explicitly not kept
anymore. This allows us to treat the translation DocumentFragment as the
reference for iteration over child nodes.
- The overlay function is also no longer recursive. Any nested HTML
will be lost and only its textContent will be preserved.
- Added `data-l10n-attrs` to allow for whitelisting localizable attributes (#70)
- Added a guard to prevent registering nested roots (#72)
- Added a guard to prevent leaking attributes between translations (#73)
- Added a performance optimization coalescing all translations from mutations
- Extend formatWithFallback to accept async iterator (#46)
- Documented all methods
- Removed `DOMLocalization.prototype.translateRoot` method
- Simplified initial version of DOM Overlays (to be extended in 0.2) (#71)
- Only children of the white-listed types are allowed now. It's not possible
anymore to put elements of other types in the source HTML to make exceptions.
- The identity of the source element's children is explicitly not kept
anymore. This allows us to treat the translation DocumentFragment as the
reference for iteration over child nodes.
- The overlay function is also no longer recursive. Any nested HTML
will be lost and only its textContent will be preserved.
- Added `data-l10n-attrs` to allow for whitelisting localizable attributes (#70)
- Added a guard to prevent registering nested roots (#72)
- Added a guard to prevent leaking attributes between translations (#73)
- Added a performance optimization coalescing all translations from mutations
per animation frame (#113)

@@ -102,4 +108,4 @@

- Introduce Fluent bindings for DOM.
- Introduce Fluent bindings for DOM.
The initial release.
The initial release.

2

esm/dom_localization.d.ts

@@ -143,3 +143,3 @@ /**

*/
translateFragment(frag: any): Promise<any>;
translateFragment(frag: DOMFragment): Promise<any>;
/**

@@ -146,0 +146,0 @@ * Translate a list of DOM elements asynchronously using this

6

esm/dom_localization.js

@@ -36,3 +36,3 @@ import translateElement from "./overlay.js";

subtree: true,
attributeFilter: [L10NID_ATTR_NAME, L10NARGS_ATTR_NAME]
attributeFilter: [L10NID_ATTR_NAME, L10NARGS_ATTR_NAME],
};

@@ -107,3 +107,3 @@ }

id: element.getAttribute(L10NID_ATTR_NAME),
args: JSON.parse(element.getAttribute(L10NARGS_ATTR_NAME) || null)
args: JSON.parse(element.getAttribute(L10NARGS_ATTR_NAME) || null),
};

@@ -321,5 +321,5 @@ }

id: element.getAttribute(L10NID_ATTR_NAME),
args: JSON.parse(element.getAttribute(L10NARGS_ATTR_NAME) || null)
args: JSON.parse(element.getAttribute(L10NARGS_ATTR_NAME) || null),
};
}
}

67

esm/localization.d.ts

@@ -34,22 +34,25 @@ /**

/**
* Format translations into {value, attributes} objects.
* Format translations into `{value, attributes}` objects.
*
* The fallback logic is the same as in `formatValues` but it returns {value,
* attributes} objects which are suitable for the translation of DOM
* elements.
* The fallback logic is the same as in `formatValues`
* but it returns `{value, attributes}` objects
* which are suitable for the translation of DOM elements.
*
* docL10n.formatMessages([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'welcome'}
* ]).then(console.log);
* Returns a Promise resolving to an array of the translation strings.
*
* // [
* // { value: 'Hello, Mary!', attributes: null },
* // {
* // value: 'Welcome!',
* // attributes: [ { name: "title", value: 'Hello' } ]
* // }
* // ]
* @example
* ```js
* docL10n.formatMessages([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'welcome'}
* ]).then(console.log);
*
* Returns a Promise resolving to an array of the translation strings.
* // [
* // { value: 'Hello, Mary!', attributes: null },
* // {
* // value: 'Welcome!',
* // attributes: [ { name: "title", value: 'Hello' } ]
* // }
* // ]
* ```
*

@@ -67,11 +70,14 @@ * @param {Array<Object>} keys

*
* docL10n.formatValues([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'hello', args: { who: 'John' }},
* {id: 'welcome'}
* ]).then(console.log);
* Returns a Promise resolving to an array of the translation strings.
*
* // ['Hello, Mary!', 'Hello, John!', 'Welcome!']
* @example
* ```js
* docL10n.formatValues([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'hello', args: { who: 'John' }},
* {id: 'welcome'}
* ]).then(console.log);
*
* Returns a Promise resolving to an array of the translation strings.
* // ['Hello, Mary!', 'Hello, John!', 'Welcome!']
* ```
*

@@ -88,8 +94,2 @@ * @param {Array<Object>} keys

*
* docL10n.formatValue(
* 'hello', { who: 'world' }
* ).then(console.log);
*
* // 'Hello, world!'
*
* Returns a Promise resolving to the translation string.

@@ -101,2 +101,11 @@ *

*
* @example
* ```js
* docL10n.formatValue(
* 'hello', { who: 'world' }
* ).then(console.log);
*
* // 'Hello, world!'
* ```
*
* @param {string} id - Identifier of the translation to format

@@ -103,0 +112,0 @@ * @param {Object} [args] - Optional external arguments

67

esm/localization.js

@@ -69,22 +69,25 @@ /* eslint no-console: ["error", { allow: ["warn", "error"] }] */

/**
* Format translations into {value, attributes} objects.
* Format translations into `{value, attributes}` objects.
*
* The fallback logic is the same as in `formatValues` but it returns {value,
* attributes} objects which are suitable for the translation of DOM
* elements.
* The fallback logic is the same as in `formatValues`
* but it returns `{value, attributes}` objects
* which are suitable for the translation of DOM elements.
*
* docL10n.formatMessages([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'welcome'}
* ]).then(console.log);
* Returns a Promise resolving to an array of the translation strings.
*
* // [
* // { value: 'Hello, Mary!', attributes: null },
* // {
* // value: 'Welcome!',
* // attributes: [ { name: "title", value: 'Hello' } ]
* // }
* // ]
* @example
* ```js
* docL10n.formatMessages([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'welcome'}
* ]).then(console.log);
*
* Returns a Promise resolving to an array of the translation strings.
* // [
* // { value: 'Hello, Mary!', attributes: null },
* // {
* // value: 'Welcome!',
* // attributes: [ { name: "title", value: 'Hello' } ]
* // }
* // ]
* ```
*

@@ -104,11 +107,14 @@ * @param {Array<Object>} keys

*
* docL10n.formatValues([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'hello', args: { who: 'John' }},
* {id: 'welcome'}
* ]).then(console.log);
* Returns a Promise resolving to an array of the translation strings.
*
* // ['Hello, Mary!', 'Hello, John!', 'Welcome!']
* @example
* ```js
* docL10n.formatValues([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'hello', args: { who: 'John' }},
* {id: 'welcome'}
* ]).then(console.log);
*
* Returns a Promise resolving to an array of the translation strings.
* // ['Hello, Mary!', 'Hello, John!', 'Welcome!']
* ```
*

@@ -127,8 +133,2 @@ * @param {Array<Object>} keys

*
* docL10n.formatValue(
* 'hello', { who: 'world' }
* ).then(console.log);
*
* // 'Hello, world!'
*
* Returns a Promise resolving to the translation string.

@@ -140,2 +140,11 @@ *

*
* @example
* ```js
* docL10n.formatValue(
* 'hello', { who: 'world' }
* ).then(console.log);
*
* // 'Hello, world!'
* ```
*
* @param {string} id - Identifier of the translation to format

@@ -142,0 +151,0 @@ * @param {Object} [args] - Optional external arguments

57

esm/overlay.js

@@ -16,5 +16,27 @@ /* eslint no-console: ["error", {allow: ["warn"]}] */

"http://www.w3.org/1999/xhtml": [
"em", "strong", "small", "s", "cite", "q", "dfn", "abbr", "data",
"time", "code", "var", "samp", "kbd", "sub", "sup", "i", "b", "u",
"mark", "bdi", "bdo", "span", "br", "wbr"
"em",
"strong",
"small",
"s",
"cite",
"q",
"dfn",
"abbr",
"data",
"time",
"code",
"var",
"samp",
"kbd",
"sub",
"sup",
"i",
"b",
"u",
"mark",
"bdi",
"bdo",
"span",
"br",
"wbr",
],

@@ -36,8 +58,12 @@ };

textarea: ["placeholder"],
th: ["abbr"]
th: ["abbr"],
},
"http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul": {
global: [
"accesskey", "aria-label", "aria-valuetext", "label",
"title", "tooltiptext"
"accesskey",
"aria-label",
"aria-valuetext",
"label",
"title",
"tooltiptext",
],

@@ -48,3 +74,3 @@ description: ["value"],

textbox: ["placeholder", "value"],
}
},
};

@@ -147,4 +173,6 @@ /**

const explicitlyAllowed = toElement.hasAttribute("data-l10n-attrs")
? toElement.getAttribute("data-l10n-attrs")
.split(",").map(i => i.trim())
? toElement
.getAttribute("data-l10n-attrs")
.split(",")
.map(i => i.trim())
: null;

@@ -154,4 +182,4 @@ // Remove existing localizable attributes if they

for (const attr of Array.from(toElement.attributes)) {
if (isAttrNameLocalizable(attr.name, toElement, explicitlyAllowed)
&& !hasAttribute(fromElement.attributes, attr.name)) {
if (isAttrNameLocalizable(attr.name, toElement, explicitlyAllowed) &&
!hasAttribute(fromElement.attributes, attr.name)) {
toElement.removeAttribute(attr.name);

@@ -168,4 +196,4 @@ }

for (const attr of Array.from(fromElement.attributes)) {
if (isAttrNameLocalizable(attr.name, toElement, explicitlyAllowed)
&& toElement.getAttribute(attr.name) !== attr.value) {
if (isAttrNameLocalizable(attr.name, toElement, explicitlyAllowed) &&
toElement.getAttribute(attr.name) !== attr.value) {
toElement.setAttribute(attr.name, attr.value);

@@ -293,3 +321,4 @@ }

if (element.namespaceURI === "http://www.w3.org/1999/xhtml" &&
elemName === "input" && attrName === "value") {
elemName === "input" &&
attrName === "value") {
const type = element.type.toLowerCase();

@@ -296,0 +325,0 @@ if (type === "submit" || type === "button" || type === "reset") {

134

index.js

@@ -1,2 +0,2 @@

/* @fluent/dom@0.8.1 */
/** @fluent/dom@0.9.0 */
(function (global, factory) {

@@ -23,5 +23,27 @@ typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('cached-iterable')) :

"http://www.w3.org/1999/xhtml": [
"em", "strong", "small", "s", "cite", "q", "dfn", "abbr", "data",
"time", "code", "var", "samp", "kbd", "sub", "sup", "i", "b", "u",
"mark", "bdi", "bdo", "span", "br", "wbr"
"em",
"strong",
"small",
"s",
"cite",
"q",
"dfn",
"abbr",
"data",
"time",
"code",
"var",
"samp",
"kbd",
"sub",
"sup",
"i",
"b",
"u",
"mark",
"bdi",
"bdo",
"span",
"br",
"wbr",
],

@@ -43,8 +65,12 @@ };

textarea: ["placeholder"],
th: ["abbr"]
th: ["abbr"],
},
"http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul": {
global: [
"accesskey", "aria-label", "aria-valuetext", "label",
"title", "tooltiptext"
"accesskey",
"aria-label",
"aria-valuetext",
"label",
"title",
"tooltiptext",
],

@@ -55,3 +81,3 @@ description: ["value"],

textbox: ["placeholder", "value"],
}
},
};

@@ -154,4 +180,6 @@ /**

const explicitlyAllowed = toElement.hasAttribute("data-l10n-attrs")
? toElement.getAttribute("data-l10n-attrs")
.split(",").map(i => i.trim())
? toElement
.getAttribute("data-l10n-attrs")
.split(",")
.map(i => i.trim())
: null;

@@ -161,4 +189,4 @@ // Remove existing localizable attributes if they

for (const attr of Array.from(toElement.attributes)) {
if (isAttrNameLocalizable(attr.name, toElement, explicitlyAllowed)
&& !hasAttribute(fromElement.attributes, attr.name)) {
if (isAttrNameLocalizable(attr.name, toElement, explicitlyAllowed) &&
!hasAttribute(fromElement.attributes, attr.name)) {
toElement.removeAttribute(attr.name);

@@ -175,4 +203,4 @@ }

for (const attr of Array.from(fromElement.attributes)) {
if (isAttrNameLocalizable(attr.name, toElement, explicitlyAllowed)
&& toElement.getAttribute(attr.name) !== attr.value) {
if (isAttrNameLocalizable(attr.name, toElement, explicitlyAllowed) &&
toElement.getAttribute(attr.name) !== attr.value) {
toElement.setAttribute(attr.name, attr.value);

@@ -300,3 +328,4 @@ }

if (element.namespaceURI === "http://www.w3.org/1999/xhtml" &&
elemName === "input" && attrName === "value") {
elemName === "input" &&
attrName === "value") {
const type = element.type.toLowerCase();

@@ -389,22 +418,25 @@ if (type === "submit" || type === "button" || type === "reset") {

/**
* Format translations into {value, attributes} objects.
* Format translations into `{value, attributes}` objects.
*
* The fallback logic is the same as in `formatValues` but it returns {value,
* attributes} objects which are suitable for the translation of DOM
* elements.
* The fallback logic is the same as in `formatValues`
* but it returns `{value, attributes}` objects
* which are suitable for the translation of DOM elements.
*
* docL10n.formatMessages([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'welcome'}
* ]).then(console.log);
* Returns a Promise resolving to an array of the translation strings.
*
* // [
* // { value: 'Hello, Mary!', attributes: null },
* // {
* // value: 'Welcome!',
* // attributes: [ { name: "title", value: 'Hello' } ]
* // }
* // ]
* @example
* ```js
* docL10n.formatMessages([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'welcome'}
* ]).then(console.log);
*
* Returns a Promise resolving to an array of the translation strings.
* // [
* // { value: 'Hello, Mary!', attributes: null },
* // {
* // value: 'Welcome!',
* // attributes: [ { name: "title", value: 'Hello' } ]
* // }
* // ]
* ```
*

@@ -424,11 +456,14 @@ * @param {Array<Object>} keys

*
* docL10n.formatValues([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'hello', args: { who: 'John' }},
* {id: 'welcome'}
* ]).then(console.log);
* Returns a Promise resolving to an array of the translation strings.
*
* // ['Hello, Mary!', 'Hello, John!', 'Welcome!']
* @example
* ```js
* docL10n.formatValues([
* {id: 'hello', args: { who: 'Mary' }},
* {id: 'hello', args: { who: 'John' }},
* {id: 'welcome'}
* ]).then(console.log);
*
* Returns a Promise resolving to an array of the translation strings.
* // ['Hello, Mary!', 'Hello, John!', 'Welcome!']
* ```
*

@@ -447,8 +482,2 @@ * @param {Array<Object>} keys

*
* docL10n.formatValue(
* 'hello', { who: 'world' }
* ).then(console.log);
*
* // 'Hello, world!'
*
* Returns a Promise resolving to the translation string.

@@ -460,2 +489,11 @@ *

*
* @example
* ```js
* docL10n.formatValue(
* 'hello', { who: 'world' }
* ).then(console.log);
*
* // 'Hello, world!'
* ```
*
* @param {string} id - Identifier of the translation to format

@@ -628,3 +666,3 @@ * @param {Object} [args] - Optional external arguments

subtree: true,
attributeFilter: [L10NID_ATTR_NAME, L10NARGS_ATTR_NAME]
attributeFilter: [L10NID_ATTR_NAME, L10NARGS_ATTR_NAME],
};

@@ -699,3 +737,3 @@ }

id: element.getAttribute(L10NID_ATTR_NAME),
args: JSON.parse(element.getAttribute(L10NARGS_ATTR_NAME) || null)
args: JSON.parse(element.getAttribute(L10NARGS_ATTR_NAME) || null),
};

@@ -913,3 +951,3 @@ }

id: element.getAttribute(L10NID_ATTR_NAME),
args: JSON.parse(element.getAttribute(L10NARGS_ATTR_NAME) || null)
args: JSON.parse(element.getAttribute(L10NARGS_ATTR_NAME) || null),
};

@@ -922,4 +960,2 @@ }

Object.defineProperty(exports, '__esModule', { value: true });
}));

6

package.json
{
"name": "@fluent/dom",
"version": "0.8.1",
"version": "0.9.0",
"description": "Fluent bindings for DOM",

@@ -43,3 +43,3 @@ "repository": {

"engines": {
"node": ">=12.0.0",
"node": ">=14.0.0",
"npm": ">=7.0.0"

@@ -49,3 +49,3 @@ },

"@fluent/bundle": "file:../fluent-bundle",
"jsdom": "^17.0.0"
"jsdom": "^21.1.0"
},

@@ -52,0 +52,0 @@ "dependencies": {

39

README.md

@@ -5,8 +5,7 @@ # @fluent/dom ![](https://github.com/projectfluent/fluent.js/workflows/test/badge.svg)

[Project Fluent]: https://projectfluent.org
[project fluent]: https://projectfluent.org
## Installation
`@fluent/dom` can be used both on the client-side and the server-side. You
`@fluent/dom` can be used both on the client-side and the server-side. You
can install it from the npm registry or use it as a standalone script (as the

@@ -17,3 +16,2 @@ `FluentDOM` global).

## How to use

@@ -29,14 +27,14 @@

```javascript
import { DOMLocalization } from '@fluent/dom'
import { DOMLocalization } from "@fluent/dom";
const l10n = new DOMLocalization(MutationObserver, [
'/browser/main.ftl',
'/toolkit/menu.ftl'
], generateBundles);
const l10n = new DOMLocalization(
["/browser/main.ftl", "/toolkit/menu.ftl"],
generateBundles
);
l10n.connectRoot(document.documentElement);
l10n.translateDocument();
l10n.translateRoots();
const h1 = document.querySelector('h1');
const h1 = document.querySelector("h1");

@@ -46,3 +44,3 @@ // Sets `data-l10n-id` and `data-l10n-args` which triggers

// element.
l10n.setAttributes(h1, 'welcome', { user: 'Anna' });
l10n.setAttributes(h1, "welcome", { user: "Anna" });
```

@@ -54,18 +52,19 @@

```javascript
import { Localization } from '@fluent/dom'
import { Localization } from "@fluent/dom";
function *generateBundles() {
function* generateBundles() {
// Some lazy logic for yielding FluentBundles.
yield *[bundle1, bundle2];
yield* [bundle1, bundle2];
}
const l10n = new Localization(document, [
'/browser/main.ftl',
'/toolkit/menu.ftl'
], generateBundles);
const l10n = new Localization(
document,
["/browser/main.ftl", "/toolkit/menu.ftl"],
generateBundles
);
async function main() {
const msg = await l10n.formatValue('welcome', { name: 'Anna' });
const msg = await l10n.formatValue("welcome", { name: "Anna" });
// → 'Welcome, Anna!'
}
```
SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

About

Packages

Stay in touch

Get open source security insights delivered straight into your inbox.

  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc