@lion/ui 0.23.0 → 0.24.0

package/components/localize/test/localize.test.js

@@ -1,5 +1,4 @@
 import { expect } from '@open-wc/testing';
-
 import { getLocalizeManager, LocalizeManager } from '@lion/ui/localize-no-side-effects.js';
 
 /**
@@ -14,7 +13,6 @@ function getProtectedMembers(localizeManagerEl) {
     fallbackLocale,
   };
 }
-
 describe('localize', () => {
   const localizeManager = getLocalizeManager();
   // this is an important mindset:
@@ -26,12 +24,10 @@ describe('localize', () => {
   it('is an instance of LocalizeManager', () => {
     expect(localizeManager).to.be.an.instanceOf(LocalizeManager);
   });
-
   it('is configured to automatically load namespaces if locale is changed', () => {
     const { autoLoadOnLocaleChange } = getProtectedMembers(localizeManager);
     expect(autoLoadOnLocaleChange).to.equal(true);
   });
-
   it('is configured to fallback to the locale "en-GB"', () => {
     const { fallbackLocale } = getProtectedMembers(localizeManager);
     expect(fallbackLocale).to.equal('en-GB');

package/components/localize/test/number/formatNumber.test.js

@@ -6,7 +6,7 @@ import { localizeTearDown } from '@lion/ui/localize-test-helpers.js';
  * @param {string} currency
  * @returns {Intl.NumberFormatOptions}
  */
-const currencyCode = currency => ({
+const currencyCode = (currency) => ({
   style: 'currency',
   currencyDisplay: 'code',
   currency,
@@ -15,137 +15,226 @@ const currencyCode = currency => ({
  * @param {string} currency
  * @returns {Intl.NumberFormatOptions}
  */
-const currencySymbol = currency => ({
+const currencySymbol = (currency) => ({
   style: 'currency',
   currencyDisplay: 'symbol',
   currency,
 });
-
 describe('formatNumber', () => {
   const localizeManager = getLocalizeManager();
-
   afterEach(localizeTearDown);
-
   it('displays the appropriate amount of decimal places based on currencies spec http://www.currency-iso.org/en/home/tables/table-a1.html', () => {
-    const clean = /** @param {string} str */ str => str.replace(/[a-zA-Z]+/g, '').trim();
+    const clean = /** @param {string} str */ (str) => str.replace(/[a-zA-Z]+/g, '').trim();
     expect(clean(formatNumber(123456.789, currencyCode('JPY')))).to.equal('123,457');
     expect(clean(formatNumber(123456.789, currencyCode('EUR')))).to.equal('123,456.79');
     expect(clean(formatNumber(123456.789, currencyCode('BHD')))).to.equal('123,456.789');
   });
-
   it('can display currency as code', () => {
     expect(formatNumber(123456.789, currencyCode('EUR'))).to.equal('EUR 123,456.79');
     expect(formatNumber(123456.789, currencyCode('USD'))).to.equal('USD 123,456.79');
   });
-
   it('can display currency as symbol', () => {
     expect(formatNumber(123456.789, currencySymbol('EUR'))).to.equal('€123,456.79');
     expect(formatNumber(123456.789, currencySymbol('USD'))).to.equal('US$123,456.79');
   });
-
   it('uses minus U+2212 (and not dash) to indicate negative numbers ', () => {
-    expect(formatNumber(-12, { style: 'decimal', maximumFractionDigits: 0 })).to.equal('−12');
+    expect(
+      formatNumber(-12, {
+        style: 'decimal',
+        maximumFractionDigits: 0,
+      }),
+    ).to.equal('−12');
   });
-
   it('rounds (negative) numbers e.g. `roundMode: round`', () => {
-    expect(formatNumber(12.4, { roundMode: 'round' })).to.equal('12');
-    expect(formatNumber(12.6, { roundMode: 'round' })).to.equal('13');
-
-    expect(formatNumber(-12.4, { roundMode: 'round' })).to.equal('−12');
-    expect(formatNumber(-12.6, { roundMode: 'round' })).to.equal('−13');
+    expect(
+      formatNumber(12.4, {
+        roundMode: 'round',
+      }),
+    ).to.equal('12');
+    expect(
+      formatNumber(12.6, {
+        roundMode: 'round',
+      }),
+    ).to.equal('13');
+    expect(
+      formatNumber(-12.4, {
+        roundMode: 'round',
+      }),
+    ).to.equal('−12');
+    expect(
+      formatNumber(-12.6, {
+        roundMode: 'round',
+      }),
+    ).to.equal('−13');
   });
-
   it("rounds (negative) numbers up when `roundMode: 'ceiling'`", () => {
-    expect(formatNumber(12.4, { roundMode: 'ceiling' })).to.equal('13');
-    expect(formatNumber(12.6, { roundMode: 'ceiling' })).to.equal('13');
-
-    expect(formatNumber(-12.4, { roundMode: 'ceiling' })).to.equal('−12');
-    expect(formatNumber(-12.6, { roundMode: 'ceiling' })).to.equal('−12');
+    expect(
+      formatNumber(12.4, {
+        roundMode: 'ceiling',
+      }),
+    ).to.equal('13');
+    expect(
+      formatNumber(12.6, {
+        roundMode: 'ceiling',
+      }),
+    ).to.equal('13');
+    expect(
+      formatNumber(-12.4, {
+        roundMode: 'ceiling',
+      }),
+    ).to.equal('−12');
+    expect(
+      formatNumber(-12.6, {
+        roundMode: 'ceiling',
+      }),
+    ).to.equal('−12');
   });
-
   it('rounds (negative) numbers down when `roundMode: floor`', () => {
-    expect(formatNumber(12.4, { roundMode: 'floor' })).to.equal('12');
-    expect(formatNumber(12.6, { roundMode: 'floor' })).to.equal('12');
-
-    expect(formatNumber(-12.4, { roundMode: 'floor' })).to.equal('−13');
-    expect(formatNumber(-12.6, { roundMode: 'floor' })).to.equal('−13');
+    expect(
+      formatNumber(12.4, {
+        roundMode: 'floor',
+      }),
+    ).to.equal('12');
+    expect(
+      formatNumber(12.6, {
+        roundMode: 'floor',
+      }),
+    ).to.equal('12');
+    expect(
+      formatNumber(-12.4, {
+        roundMode: 'floor',
+      }),
+    ).to.equal('−13');
+    expect(
+      formatNumber(-12.6, {
+        roundMode: 'floor',
+      }),
+    ).to.equal('−13');
   });
-
   it('returns empty string when passing wrong type', () => {
     // @ts-ignore tests what happens if you pass wrong type
     expect(formatNumber('foo')).to.equal('');
     // @ts-ignore tests what happens if you pass wrong type
     expect(formatNumber(undefined)).to.equal('');
   });
-
   it('uses `localizeManager.formatNumberOptions.returnIfNaN`', () => {
     const savedReturnIfNaN = localizeManager.formatNumberOptions.returnIfNaN;
-
     localizeManager.formatNumberOptions.returnIfNaN = '-';
     // @ts-ignore
     expect(formatNumber('foo')).to.equal('-');
-
     localizeManager.formatNumberOptions.returnIfNaN = savedReturnIfNaN;
   });
-
   it("can set what to returns when NaN via `returnIfNaN: 'foo'`", () => {
     // @ts-ignore
-    expect(formatNumber('foo', { returnIfNaN: '-' })).to.equal('-');
+    expect(
+      formatNumber('foo', {
+        returnIfNaN: '-',
+      }),
+    ).to.equal('-');
   });
-
   it('uses `localizeManager.locale`', () => {
-    expect(formatNumber(123456.789, { style: 'decimal', maximumFractionDigits: 2 })).to.equal(
-      '123,456.79',
-    );
+    expect(
+      formatNumber(123456.789, {
+        style: 'decimal',
+        maximumFractionDigits: 2,
+      }),
+    ).to.equal('123,456.79');
     localizeManager.locale = 'de-DE';
-    expect(formatNumber(123456.789, { style: 'decimal', maximumFractionDigits: 2 })).to.equal(
-      '123.456,79',
-    );
+    expect(
+      formatNumber(123456.789, {
+        style: 'decimal',
+        maximumFractionDigits: 2,
+      }),
+    ).to.equal('123.456,79');
   });
-
   it('can set locale to use', () => {
     expect(
-      formatNumber(123456.789, { locale: 'en-GB', style: 'decimal', maximumFractionDigits: 2 }),
+      formatNumber(123456.789, {
+        locale: 'en-GB',
+        style: 'decimal',
+        maximumFractionDigits: 2,
+      }),
     ).to.equal('123,456.79');
     expect(
-      formatNumber(123456.789, { locale: 'de-DE', style: 'decimal', maximumFractionDigits: 2 }),
+      formatNumber(123456.789, {
+        locale: 'de-DE',
+        style: 'decimal',
+        maximumFractionDigits: 2,
+      }),
     ).to.equal('123.456,79');
   });
-
   it('can specify max decimal places by `maximumFractionDigits: 3`', () => {
     expect(formatNumber(123456.789)).to.equal('123,456.789');
-    expect(formatNumber(123456.789, { style: 'decimal', maximumFractionDigits: 3 })).to.equal(
-      '123,456.789',
-    );
-    expect(formatNumber(123456.789, { style: 'decimal', maximumFractionDigits: 1 })).to.equal(
-      '123,456.8',
-    );
+    expect(
+      formatNumber(123456.789, {
+        style: 'decimal',
+        maximumFractionDigits: 3,
+      }),
+    ).to.equal('123,456.789');
+    expect(
+      formatNumber(123456.789, {
+        style: 'decimal',
+        maximumFractionDigits: 1,
+      }),
+    ).to.equal('123,456.8');
   });
-
   it('can specify min decimal places by `minimumFractionDigits: 3`', () => {
     expect(formatNumber(12.3)).to.equal('12.3');
-    expect(formatNumber(12.3456, { style: 'decimal', minimumFractionDigits: 3 })).to.equal(
-      '12.346',
-    );
-    expect(formatNumber(12.3, { style: 'decimal', minimumFractionDigits: 3 })).to.equal('12.300');
+    expect(
+      formatNumber(12.3456, {
+        style: 'decimal',
+        minimumFractionDigits: 3,
+      }),
+    ).to.equal('12.346');
+    expect(
+      formatNumber(12.3, {
+        style: 'decimal',
+        minimumFractionDigits: 3,
+      }),
+    ).to.equal('12.300');
   });
-
   it('can specify to show at least x digits by `minimumIntegerDigits: 5`', () => {
     expect(formatNumber(123)).to.equal('123');
-    expect(formatNumber(123, { minimumIntegerDigits: 5 })).to.equal('00,123');
+    expect(
+      formatNumber(123, {
+        minimumIntegerDigits: 5,
+      }),
+    ).to.equal('00,123');
   });
-
   it('can display 0 decimal places', () => {
-    expect(formatNumber(12.4, { style: 'decimal', maximumFractionDigits: 0 })).to.equal('12');
+    expect(
+      formatNumber(12.4, {
+        style: 'decimal',
+        maximumFractionDigits: 0,
+      }),
+    ).to.equal('12');
   });
-
   it('formats numbers correctly', () => {
     localizeManager.locale = 'nl-NL';
-    expect(formatNumber(0, { style: 'decimal', minimumFractionDigits: 2 })).to.equal('0,00');
-    expect(formatNumber(0.1, { style: 'decimal', minimumFractionDigits: 2 })).to.equal('0,10');
-    expect(formatNumber(0.12, { style: 'decimal', minimumFractionDigits: 2 })).to.equal('0,12');
     expect(
-      formatNumber(0.123, { style: 'decimal', minimumFractionDigits: 2, maximumFractionDigits: 2 }),
+      formatNumber(0, {
+        style: 'decimal',
+        minimumFractionDigits: 2,
+      }),
+    ).to.equal('0,00');
+    expect(
+      formatNumber(0.1, {
+        style: 'decimal',
+        minimumFractionDigits: 2,
+      }),
+    ).to.equal('0,10');
+    expect(
+      formatNumber(0.12, {
+        style: 'decimal',
+        minimumFractionDigits: 2,
+      }),
+    ).to.equal('0,12');
+    expect(
+      formatNumber(0.123, {
+        style: 'decimal',
+        minimumFractionDigits: 2,
+        maximumFractionDigits: 2,
+      }),
     ).to.equal('0,12');
     expect(
       formatNumber(0.1234, {
@@ -161,12 +250,42 @@ describe('formatNumber', () => {
         maximumFractionDigits: 2,
       }),
     ).to.equal('0,12');
-    expect(formatNumber(1, { style: 'decimal', minimumFractionDigits: 2 })).to.equal('1,00');
-    expect(formatNumber(1.0, { style: 'decimal', minimumFractionDigits: 2 })).to.equal('1,00');
-    expect(formatNumber(1.1, { style: 'decimal', minimumFractionDigits: 2 })).to.equal('1,10');
-    expect(formatNumber(1.12, { style: 'decimal', minimumFractionDigits: 2 })).to.equal('1,12');
-    expect(formatNumber(1.123, { style: 'decimal', minimumFractionDigits: 2 })).to.equal('1,123');
-    expect(formatNumber(1.1234, { style: 'decimal', maximumFractionDigits: 2 })).to.equal('1,12');
+    expect(
+      formatNumber(1, {
+        style: 'decimal',
+        minimumFractionDigits: 2,
+      }),
+    ).to.equal('1,00');
+    expect(
+      formatNumber(1.0, {
+        style: 'decimal',
+        minimumFractionDigits: 2,
+      }),
+    ).to.equal('1,00');
+    expect(
+      formatNumber(1.1, {
+        style: 'decimal',
+        minimumFractionDigits: 2,
+      }),
+    ).to.equal('1,10');
+    expect(
+      formatNumber(1.12, {
+        style: 'decimal',
+        minimumFractionDigits: 2,
+      }),
+    ).to.equal('1,12');
+    expect(
+      formatNumber(1.123, {
+        style: 'decimal',
+        minimumFractionDigits: 2,
+      }),
+    ).to.equal('1,123');
+    expect(
+      formatNumber(1.1234, {
+        style: 'decimal',
+        maximumFractionDigits: 2,
+      }),
+    ).to.equal('1,12');
     expect(
       formatNumber(1.12345678, {
         style: 'decimal',
@@ -174,7 +293,12 @@ describe('formatNumber', () => {
         maximumFractionDigits: 2,
       }),
     ).to.equal('1,12');
-    expect(formatNumber(1000, { style: 'decimal', minimumFractionDigits: 2 })).to.equal('1.000,00');
+    expect(
+      formatNumber(1000, {
+        style: 'decimal',
+        minimumFractionDigits: 2,
+      }),
+    ).to.equal('1.000,00');
     expect(
       formatNumber(112345678, {
         style: 'decimal',
@@ -192,7 +316,6 @@ describe('formatNumber', () => {
       }),
     ).to.equal('112 345 678.00');
   });
-
   it('throws when decimal and group separator are the same value, only when problematic', () => {
     localizeManager.locale = 'nl-NL';
     const fn = () =>
@@ -202,11 +325,9 @@ describe('formatNumber', () => {
         maximumFractionDigits: 2,
         decimalSeparator: '.', // same as group separator for nl-NL
       });
-
     expect(fn).to.throw(`Decimal and group (thousand) separator are the same character: '.'.
 This can happen due to both props being specified as the same, or one of the props being the same as the other one from default locale.
 Please specify .groupSeparator / .decimalSeparator on the formatOptions object to be different.`);
-
     const fn2 = () =>
       formatNumber(112345678, {
         style: 'decimal',
@@ -215,7 +336,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         groupSeparator: ',',
         decimalSeparator: ',',
       });
-
     expect(fn2).to.throw(`Decimal and group (thousand) separator are the same character: ','.
 This can happen due to both props being specified as the same, or one of the props being the same as the other one from default locale.
 Please specify .groupSeparator / .decimalSeparator on the formatOptions object to be different.`);
@@ -226,7 +346,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         groupSeparator: ',',
         decimalSeparator: ',',
       });
-
     expect(fn3).to.not.throw();
 
     // this one doesn't end up with group separators (<1000), so not a problem
@@ -238,19 +357,20 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         groupSeparator: ',',
         decimalSeparator: ',',
       });
-
     expect(fn4).to.not.throw();
   });
-
   it('formats 2-digit decimals correctly', () => {
     localizeManager.locale = 'nl-NL';
-    Array.from(new Array(100), (val, index) => index).forEach(i => {
+    Array.from(new Array(100), (val, index) => index).forEach((i) => {
       const iString = `${i}`;
       let number = 0.0;
       number += i * 0.01;
-      expect(formatNumber(number, { style: 'decimal', minimumFractionDigits: 2 })).to.equal(
-        `0,${iString.padStart(2, '0')}`,
-      );
+      expect(
+        formatNumber(number, {
+          style: 'decimal',
+          minimumFractionDigits: 2,
+        }),
+      ).to.equal(`0,${iString.padStart(2, '0')}`);
     });
   });
 
@@ -262,7 +382,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
     // eslint-disable-next-line no-loss-of-precision
     expect(formatNumber(12345678987654321.42)).to.equal('12,345,678,987,654,321.42');
   });
-
   describe('normalization', () => {
     describe('en-GB', () => {
       it('supports basics', () => {
@@ -275,7 +394,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(123456.789, currencySymbol('JPY'))).to.equal('JP¥123,457');
       });
     });
-
     describe('en-US', () => {
       it('supports basics', () => {
         localizeManager.locale = 'en-US';
@@ -287,7 +405,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(123456.789, currencySymbol('JPY'))).to.equal('¥123,457');
       });
     });
-
     describe('en-AU', () => {
       it('supports basics', () => {
         localizeManager.locale = 'en-AU';
@@ -302,7 +419,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(-123456.789, currencySymbol('JPY'))).to.equal('−¥123,457');
       });
     });
-
     describe('en-PH', () => {
       it('supports basics', () => {
         localizeManager.locale = 'en-PH';
@@ -314,7 +430,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(123456.789, currencySymbol('JPY'))).to.equal('¥123,457');
       });
     });
-
     describe('nl-NL', () => {
       it('supports basics', () => {
         localizeManager.locale = 'nl-NL';
@@ -326,7 +441,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(123456.789, currencySymbol('JPY'))).to.equal('JP¥ 123.457');
       });
     });
-
     describe('nl-BE', () => {
       it('supports basics', () => {
         localizeManager.locale = 'nl-BE';
@@ -338,7 +452,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(123456.789, currencySymbol('JPY'))).to.equal('JP¥ 123.457');
       });
     });
-
     describe('fr-FR', () => {
       it('supports basics', () => {
         localizeManager.locale = 'fr-FR';
@@ -350,7 +463,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(123456.789, currencySymbol('JPY'))).to.equal('123 457 ¥');
       });
     });
-
     describe('fr-BE', () => {
       it('supports basics', () => {
         localizeManager.locale = 'fr-BE';
@@ -362,7 +474,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(123456.789, currencySymbol('JPY'))).to.equal('123 457 ¥');
       });
     });
-
     describe('bg-BG', () => {
       it('supports basics', () => {
         localizeManager.locale = 'bg-BG';
@@ -373,7 +484,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         // expect(formatNumber(123456.789, currencySymbol('USD'))).to.equal('123 456,79 $'); // TODO: fix
         // expect(formatNumber(123456.789, currencySymbol('JPY'))).to.equal('123 457 ¥'); // TODO: fix
       });
-
       it('normalizes group separator', () => {
         localizeManager.locale = 'bg-BG';
         expect(formatNumber(1.234, currencyCode('EUR'))).to.equal('1,23 EUR');
@@ -381,7 +491,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(-1234.567, currencyCode('EUR'))).to.equal('−1 234,57 EUR');
       });
     });
-
     describe('cs-CZ', () => {
       it('supports basics', () => {
         localizeManager.locale = 'cs-CZ';
@@ -395,7 +504,6 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(123456.789, currencySymbol('CZK'))).to.equal('123 456,79 Kč');
       });
     });
-
     describe('tr-TR', () => {
       it('supports basics', () => {
         localizeManager.locale = 'tr-TR';
@@ -408,19 +516,25 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         expect(formatNumber(123456.789, currencySymbol('JPY'))).to.equal('¥123.457');
         expect(formatNumber(123456.789, currencySymbol('TRY'))).to.equal('₺123.456,79');
       });
-
       it('forces turkish currency code ', () => {
         localizeManager.locale = 'tr-TR';
         expect(
-          formatNumber(1234.56, { style: 'currency', currencyDisplay: 'code', currency: 'TRY' }),
+          formatNumber(1234.56, {
+            style: 'currency',
+            currencyDisplay: 'code',
+            currency: 'TRY',
+          }),
         ).to.equal('1.234,56 TL');
         expect(
-          formatNumber(-1234.56, { style: 'currency', currencyDisplay: 'code', currency: 'TRY' }),
+          formatNumber(-1234.56, {
+            style: 'currency',
+            currencyDisplay: 'code',
+            currency: 'TRY',
+          }),
         ).to.equal('−1.234,56 TL');
       });
     });
   });
-
   describe('postProcessors', () => {
     /** @type {Map<string, import('../../types/LocalizeMixinTypes.js').NumberPostProcessor>} */
     let savedpostProcessors;
@@ -437,7 +551,7 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
      * @param {string} str
      * @returns {string}
      */
-    const commaToSpaceProcessor = str => str.replace(/,/g, ' ');
+    const commaToSpaceProcessor = (str) => str.replace(/,/g, ' ');
 
     /**
      * First space to dot processor
@@ -445,8 +559,7 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
      * @param {string} str
      * @returns {string}
      */
-    const firstSpaceToDotProcessor = str => str.replace(' ', '.');
-
+    const firstSpaceToDotProcessor = (str) => str.replace(' ', '.');
     it('uses `options.postProcessors`', () => {
       const postProcessors = new Map();
       postProcessors.set('en-GB', commaToSpaceProcessor);
@@ -456,20 +569,16 @@ Please specify .groupSeparator / .decimalSeparator on the formatOptions object t
         }),
       ).to.equal('112 345 678');
     });
-
     it('uses `localizeManager.formatNumberOptions.postProcessors`', () => {
       localizeManager.setNumberPostProcessorForLocale({
         locale: 'en-GB',
         postProcessor: commaToSpaceProcessor,
       });
-
       expect(formatNumber(112345678)).to.equal('112 345 678');
     });
-
     it('uses `options.postProcessors` and `localizeManager.formatNumberOptions.postProcessors`', () => {
       const postProcessors = new Map();
       postProcessors.set('en-GB', commaToSpaceProcessor);
-
       localizeManager.setNumberPostProcessorForLocale({
         locale: 'en-GB',
         postProcessor: firstSpaceToDotProcessor,