@lion/ui 0.0.1

package/components/localize/test/date/formatDate.test.js

@@ -0,0 +1,343 @@
+import { expect } from '@open-wc/testing';
+import { localize, formatDate, parseDate } from '@lion/ui/localize.js';
+import { localizeTearDown } from '@lion/ui/localize-test-helpers.js';
+
+const SUPPORTED_LOCALES = {
+  'bg-BG': 'Bulgarian',
+  'cs-CZ': 'Czech',
+  'de-DE': 'German (Germany)',
+  'en-AU': 'English (Australia)',
+  'en-GB': 'English (United Kingdom)',
+  'en-PH': 'English (Philippines)',
+  'en-US': 'English (United States)',
+  'es-ES': 'Spanish (Spain)',
+  'fr-FR': 'French (France)',
+  'fr-BE': 'French (Belgium)',
+  'hu-HU': 'Hungarian (Hungary)',
+  'id-ID': 'Indonesian (Indonesia)',
+  'it-IT': 'Italian (Italy)',
+  'nl-NL': 'Dutch (Netherlands)',
+  'nl-BE': 'Dutch (Belgium)',
+  'pl-PL': 'Polish (Poland)',
+  'ro-RO': 'Romanian (Romania)',
+  'ru-RU': 'Russian (Russia)',
+  'sk-SK': 'Slovak (Slovakia)',
+  'tr-TR': 'Turkish (Turkey)',
+  'uk-UA': 'Ukrainian (Ukraine)',
+  'zh-CN': 'Chinese (China)',
+  'zh-Hans': 'Chinese (Simplified Han)',
+  'zh-Hans-CN': 'Chinese (Simplified Han, China)',
+  'zh-Hans-HK': 'Chinese (Simplified Han, Hong Kong SAR China)',
+  'zh-Hans-MO': 'Chinese (Simplified Han, Macau SAR China)',
+  'zh-Hans-SG': 'Chinese (Simplified Han, Singapore)',
+  'zh-Hant': 'Chinese (Traditional Han)',
+  'zh-Hant-HK': 'Chinese (Traditional Han, Hong Kong SAR China)',
+  'zh-Hant-MO': 'Chinese (Traditional Han, Macau SAR China)',
+  'zh-Hant-TW': 'Chinese (Traditional Han, Taiwan)',
+};
+
+/**
+ * @typedef {import('../../types/LocalizeMixinTypes.js').FormatDateOptions} FormatDateOptions
+ */
+
+describe('formatDate', () => {
+  beforeEach(() => {
+    localizeTearDown();
+  });
+
+  it('displays the appropriate date based on locale', async () => {
+    const testDate = new Date('2012/05/21');
+
+    expect(formatDate(testDate)).to.equal('21/05/2012');
+
+    localize.locale = 'nl-NL';
+    expect(formatDate(testDate)).to.equal('21-05-2012');
+
+    localize.locale = 'fr-FR';
+    expect(formatDate(testDate)).to.equal('21/05/2012');
+
+    localize.locale = 'de-DE';
+    expect(formatDate(testDate)).to.equal('21.05.2012');
+
+    localize.locale = 'en-US';
+    expect(formatDate(testDate)).to.equal('05/21/2012');
+  });
+
+  it('displays the date based on options', async () => {
+    const testDate = new Date('2012/05/21');
+    /** @type {FormatDateOptions} */
+    const options = {
+      weekday: 'long',
+      year: 'numeric',
+      month: 'long',
+      day: '2-digit',
+    };
+
+    expect(formatDate(testDate, options)).to.equal('Monday, 21 May 2012');
+    localize.locale = 'nl-NL';
+    expect(formatDate(testDate, options)).to.equal('maandag 21 mei 2012');
+    localize.locale = 'fr-FR';
+    expect(formatDate(testDate, options)).to.equal('lundi 21 mai 2012');
+    localize.locale = 'de-DE';
+    expect(formatDate(testDate, options)).to.equal('Montag, 21. Mai 2012');
+    localize.locale = 'en-US';
+    expect(formatDate(testDate, options)).to.equal('Monday, May 21, 2012');
+  });
+
+  it('displays Hungarian dates correctly', async () => {
+    /** @type {FormatDateOptions} */
+    const options = {
+      weekday: 'long',
+      year: 'numeric',
+      month: 'long',
+      day: '2-digit',
+      locale: 'en-US',
+    };
+    localize.locale = 'hu-HU';
+    let date = /** @type {Date} */ (parseDate('2018-5-28'));
+    expect(formatDate(date)).to.equal('2018. 05. 28.');
+
+    date = /** @type {Date} */ (parseDate('1970-11-3'));
+    expect(formatDate(date, options)).to.equal('Tuesday, November 03, 1970');
+  });
+
+  it('displays Bulgarian dates correctly', async () => {
+    /** @type {FormatDateOptions} */
+    const options = {
+      weekday: 'long',
+      year: 'numeric',
+      month: 'long',
+      day: '2-digit',
+      locale: 'en-US',
+    };
+    localize.locale = 'bg-BG';
+    let date = /** @type {Date} */ (parseDate('29-12-2017'));
+    expect(formatDate(date)).to.equal('29.12.2017 г.');
+
+    date = /** @type {Date} */ (parseDate('13-1-1940'));
+    expect(formatDate(date)).to.equal('13.01.1940 г.');
+
+    date = /** @type {Date} */ (parseDate('3-11-1970'));
+    expect(formatDate(date, options)).to.equal('Tuesday, November 03, 1970');
+  });
+
+  it('displays US dates correctly', async () => {
+    /** @type {FormatDateOptions} */
+    const options = {
+      weekday: 'long',
+      year: 'numeric',
+      month: 'long',
+      day: '2-digit',
+      locale: 'en-US',
+    };
+    localize.locale = 'en-US';
+    let date = /** @type {Date} */ (parseDate('12-29-1940'));
+    expect(formatDate(date)).to.equal('12/29/1940');
+
+    date = /** @type {Date} */ (parseDate('1-13-1940'));
+    expect(formatDate(date)).to.equal('01/13/1940');
+
+    date = /** @type {Date} */ (parseDate('11-3-1970'));
+    expect(formatDate(date, options)).to.equal('Tuesday, November 03, 1970');
+  });
+
+  it('handles locales in options', async () => {
+    /** @type {FormatDateOptions} */
+    let options = {
+      weekday: 'long',
+      year: 'numeric',
+      month: 'long',
+      day: '2-digit',
+      locale: 'en-US',
+    };
+    let parsedDate = /** @type {Date} */ (parseDate('05.11.2017'));
+    expect(formatDate(parsedDate, options)).to.equal('Sunday, November 05, 2017');
+
+    parsedDate = /** @type {Date} */ (parseDate('01-01-1940'));
+    options = {
+      weekday: 'long',
+      year: 'numeric',
+      month: 'long',
+      day: '2-digit',
+      locale: 'nl-BE',
+    };
+    expect(formatDate(parsedDate, options)).to.equal('maandag 01 januari 1940');
+  });
+
+  describe('Date format options without "year"', () => {
+    const LOCALE_FORMATTED_DATE_MAP = {
+      'bg-BG': 'събота, 12 октомври',
+      'cs-CZ': 'sobota 12. října',
+      'de-DE': 'Samstag, 12. Oktober',
+      'en-AU': 'Saturday, 12 October',
+      'en-GB': 'Saturday, 12 October',
+      'en-PH': 'Saturday, 12 October',
+      'en-US': 'Saturday, October 12',
+      'es-ES': 'sábado, 12 de octubre',
+      'fr-FR': 'samedi 12 octobre',
+      'fr-BE': 'samedi 12 octobre',
+      'hu-HU': 'október 12., szombat',
+      'id-ID': 'Sabtu, 12 Oktober',
+      'it-IT': 'sabato 12 ottobre',
+      'nl-NL': 'zaterdag 12 oktober',
+      'nl-BE': 'zaterdag 12 oktober',
+      'pl-PL': 'sobota, 12 października',
+      'ro-RO': 'sâmbătă, 12 octombrie',
+      'ru-RU': 'суббота, 12 октября',
+      'sk-SK': 'sobota 12. októbra',
+      'tr-TR': '12 Ekim Cumartesi',
+      'uk-UA': 'субота, 12 жовтня',
+      'zh-CN': '10月12日星期六',
+      'zh-Hans': '10月12日星期六',
+      'zh-Hans-CN': '10月12日星期六',
+      'zh-Hans-HK': '10月12日星期六',
+      'zh-Hans-MO': '10月12日星期六',
+      'zh-Hans-SG': '10月12日星期六',
+      'zh-Hant': '10月12日 星期六',
+      'zh-Hant-HK': '10月12日星期六',
+      'zh-Hant-MO': '10月12日星期六',
+      'zh-Hant-TW': '10月12日 星期六',
+    };
+
+    Object.keys(SUPPORTED_LOCALES).forEach(locale => {
+      it(`handles options without year for locale: ${locale}`, async () => {
+        /** @type {FormatDateOptions} */
+        const options = {
+          weekday: 'long',
+          month: 'long',
+          day: '2-digit',
+          locale,
+        };
+        const parsedDate = /** @type {Date} */ (parseDate('12.10.2019'));
+        expect(formatDate(parsedDate, options)).to.equal(LOCALE_FORMATTED_DATE_MAP[locale]);
+      });
+    });
+  });
+
+  it('handles options without month', async () => {
+    /** @type {FormatDateOptions} */
+    const options = {
+      weekday: 'long',
+      year: 'numeric',
+      day: '2-digit',
+    };
+    const parsedDate = /** @type {Date} */ (parseDate('12.10.2019'));
+    expect(formatDate(parsedDate, options)).to.equal('Saturday 12 2019');
+  });
+
+  it('handles options without day', async () => {
+    /** @type {FormatDateOptions} */
+    const options = {
+      weekday: 'long',
+      year: 'numeric',
+      month: 'long',
+    };
+    const parsedDate = /** @type {Date} */ (parseDate('12.10.2019'));
+    expect(formatDate(parsedDate, options)).to.equal('October 2019 Saturday');
+  });
+
+  it('returns empty string when input is not a Date object', async () => {
+    const date = '1-1-2016';
+    // @ts-ignore tests what happens if you use a wrong type
+    expect(formatDate(date)).to.equal('');
+  });
+
+  describe('Date post processors', () => {
+    /**
+     * Uppercase processor
+     *
+     * @param {string} str
+     * @returns {string}
+     */
+    const upperCaseProcessor = str => str.toUpperCase();
+
+    /**
+     * Lowercase processor
+     *
+     * @param {string} str
+     * @returns {string}
+     */
+    const lowerCaseProcessor = str => str.toLocaleLowerCase();
+
+    it('displays the appropriate date after post processor set in options', async () => {
+      const testDate = new Date('2012/05/21');
+      const postProcessors = new Map();
+      postProcessors.set('nl-NL', upperCaseProcessor);
+      postProcessors.set('de-DE', lowerCaseProcessor);
+
+      /** @type {FormatDateOptions} */
+      const options = {
+        weekday: 'long',
+        year: 'numeric',
+        month: 'long',
+        day: '2-digit',
+        postProcessors,
+      };
+
+      // locale is en-GB
+      expect(formatDate(testDate, options)).to.equal('Monday, 21 May 2012');
+      localize.locale = 'nl-NL';
+      expect(formatDate(testDate, options)).to.equal('MAANDAG 21 MEI 2012');
+      localize.locale = 'de-DE';
+      expect(formatDate(testDate, options)).to.equal('montag, 21. mai 2012');
+      localize.locale = 'en-US';
+      expect(formatDate(testDate, options)).to.equal('Monday, May 21, 2012');
+    });
+
+    it('displays the appropriate date after post processor set in localize', async () => {
+      const testDate = new Date('2012/05/21');
+      /** @type {FormatDateOptions} */
+      const options = {
+        weekday: 'long',
+        year: 'numeric',
+        month: 'long',
+        day: '2-digit',
+      };
+      localize.setDatePostProcessorForLocale({
+        locale: 'nl-NL',
+        postProcessor: upperCaseProcessor,
+      });
+      localize.setDatePostProcessorForLocale({
+        locale: 'de-DE',
+        postProcessor: upperCaseProcessor,
+      });
+
+      expect(formatDate(testDate, options)).to.equal('Monday, 21 May 2012');
+      localize.locale = 'nl-NL';
+      expect(formatDate(testDate, options)).to.equal('MAANDAG 21 MEI 2012');
+      localize.locale = 'de-DE';
+      expect(formatDate(testDate, options)).to.equal('MONTAG, 21. MAI 2012');
+      localize.locale = 'en-US';
+      expect(formatDate(testDate, options)).to.equal('Monday, May 21, 2012');
+    });
+
+    it('displays the appropriate date after post processors set in options and localize', async () => {
+      const testDate = new Date('2012/05/21');
+      const postProcessors = new Map();
+      postProcessors.set('nl-NL', upperCaseProcessor);
+      postProcessors.set('de-DE', upperCaseProcessor);
+
+      /** @type {FormatDateOptions} */
+      const options = {
+        weekday: 'long',
+        year: 'numeric',
+        month: 'long',
+        day: '2-digit',
+        postProcessors,
+      };
+
+      localize.setDatePostProcessorForLocale({
+        locale: 'de-DE',
+        postProcessor: lowerCaseProcessor,
+      });
+
+      expect(formatDate(testDate, options)).to.equal('Monday, 21 May 2012');
+      localize.locale = 'nl-NL';
+      expect(formatDate(testDate, options)).to.equal('MAANDAG 21 MEI 2012');
+      localize.locale = 'de-DE';
+      expect(formatDate(testDate, options)).to.equal('MONTAG, 21. MAI 2012');
+      localize.locale = 'en-US';
+      expect(formatDate(testDate, options)).to.equal('Monday, May 21, 2012');
+    });
+  });
+});

package/components/localize/test/date/getDateFormatBasedOnLocale.test.js

@@ -0,0 +1,16 @@
+import { expect } from '@open-wc/testing';
+import { localize, getDateFormatBasedOnLocale } from '@lion/ui/localize.js';
+import { localizeTearDown } from '@lion/ui/localize-test-helpers.js';
+
+describe('getDateFormatBasedOnLocale()', () => {
+  beforeEach(() => {
+    localizeTearDown();
+  });
+
+  it('returns the positions of day, month and year', async () => {
+    localize.locale = 'en-GB';
+    expect(getDateFormatBasedOnLocale()).to.equal('day-month-year');
+    localize.locale = 'en-US';
+    expect(getDateFormatBasedOnLocale()).to.equal('month-day-year');
+  });
+});

package/components/localize/test/date/getMonthNames.test.js

@@ -0,0 +1,35 @@
+import { expect } from '@open-wc/testing';
+import { getMonthNames } from '@lion/ui/localize.js';
+
+/**
+ * @param {TemplateStringsArray} strings
+ */
+function s(strings) {
+  return strings[0].split(' ');
+}
+
+describe('getMonthNames', () => {
+  it('generates month names for a given locale', () => {
+    expect(getMonthNames({ locale: 'en-GB' })).to.deep.equal(
+      s`January February March April May June July August September October November December`,
+    );
+    expect(getMonthNames({ locale: 'nl-NL' })).to.deep.equal(
+      s`januari februari maart april mei juni juli augustus september oktober november december`,
+    );
+    expect(getMonthNames({ locale: 'zh-CH' })).to.deep.equal(
+      s`一月 二月 三月 四月 五月 六月 七月 八月 九月 十月 十一月 十二月`,
+    );
+  });
+  it('supports "short" style', () => {
+    // TODO: Chrome thinks it should be Sept, not Sep. Firefox/Webkit disagree. We could normalize it in lion.
+    // expect(getMonthNames({ locale: 'en-GB', style: 'short' })).to.deep.equal(
+    //   s`Jan Feb Mar Apr May Jun Jul Aug Sep Oct Nov Dec`,
+    // );
+    expect(getMonthNames({ locale: 'nl-NL', style: 'short' })).to.deep.equal(
+      s`jan. feb. mrt. apr. mei jun. jul. aug. sep. okt. nov. dec.`,
+    );
+    expect(getMonthNames({ locale: 'zh-CH', style: 'short' })).to.deep.equal(
+      s`1月 2月 3月 4月 5月 6月 7月 8月 9月 10月 11月 12月`,
+    );
+  });
+});

package/components/localize/test/date/getWeekdayNames.test.js

@@ -0,0 +1,68 @@
+import { expect } from '@open-wc/testing';
+
+import { getWeekdayNames } from '@lion/ui/localize.js';
+
+/**
+ * @param {TemplateStringsArray} strings
+ */
+function s(strings) {
+  return strings[0].split(' ');
+}
+
+describe('getWeekdayNames', () => {
+  it('generates weekday names for a given locale with defaults (from Sunday, long style)', () => {
+    expect(getWeekdayNames({ locale: 'en-GB' })).to.deep.equal(
+      s`Sunday Monday Tuesday Wednesday Thursday Friday Saturday`,
+    );
+    expect(getWeekdayNames({ locale: 'nl-NL' })).to.deep.equal(
+      s`zondag maandag dinsdag woensdag donderdag vrijdag zaterdag`,
+    );
+    expect(getWeekdayNames({ locale: 'zh-CH' })).to.deep.equal(
+      s`星期日 星期一 星期二 星期三 星期四 星期五 星期六`,
+    );
+  });
+
+  it('allows to specify a day when a week starts', () => {
+    expect(getWeekdayNames({ locale: 'en-GB', firstDayOfWeek: 7 })).to.deep.equal(
+      s`Sunday Monday Tuesday Wednesday Thursday Friday Saturday`,
+    );
+    expect(getWeekdayNames({ locale: 'en-GB', firstDayOfWeek: 1 })).to.deep.equal(
+      s`Monday Tuesday Wednesday Thursday Friday Saturday Sunday`,
+    );
+    expect(getWeekdayNames({ locale: 'en-GB', firstDayOfWeek: 2 })).to.deep.equal(
+      s`Tuesday Wednesday Thursday Friday Saturday Sunday Monday`,
+    );
+    expect(getWeekdayNames({ locale: 'en-GB', firstDayOfWeek: 3 })).to.deep.equal(
+      s`Wednesday Thursday Friday Saturday Sunday Monday Tuesday`,
+    );
+    expect(getWeekdayNames({ locale: 'en-GB', firstDayOfWeek: 4 })).to.deep.equal(
+      s`Thursday Friday Saturday Sunday Monday Tuesday Wednesday`,
+    );
+    expect(getWeekdayNames({ locale: 'en-GB', firstDayOfWeek: 5 })).to.deep.equal(
+      s`Friday Saturday Sunday Monday Tuesday Wednesday Thursday`,
+    );
+    expect(getWeekdayNames({ locale: 'en-GB', firstDayOfWeek: 6 })).to.deep.equal(
+      s`Saturday Sunday Monday Tuesday Wednesday Thursday Friday`,
+    );
+  });
+
+  it('supports "short" style', () => {
+    expect(getWeekdayNames({ locale: 'en-GB', style: 'short' })).to.deep.equal(
+      s`Sun Mon Tue Wed Thu Fri Sat`,
+    );
+    expect(getWeekdayNames({ locale: 'nl-NL', style: 'short' })).to.deep.equal(
+      s`zo ma di wo do vr za`,
+    );
+    expect(getWeekdayNames({ locale: 'zh-CH', style: 'short' })).to.deep.equal(
+      s`周日 周一 周二 周三 周四 周五 周六`,
+    );
+  });
+
+  it('supports "narrow" style', () => {
+    expect(getWeekdayNames({ locale: 'en-GB', style: 'narrow' })).to.deep.equal(s`S M T W T F S`);
+    expect(getWeekdayNames({ locale: 'nl-NL', style: 'narrow' })).to.deep.equal(s`Z M D W D V Z`);
+    expect(getWeekdayNames({ locale: 'zh-CH', style: 'narrow' })).to.deep.equal(
+      s`日 一 二 三 四 五 六`,
+    );
+  });
+});

package/components/localize/test/date/normalizeDateTime.test.js

@@ -0,0 +1,16 @@
+import { expect } from '@open-wc/testing';
+import { normalizeDateTime } from '@lion/ui/localize.js';
+
+describe('normalizeDateTime', () => {
+  it('returns a date with hours, minutes and seconds set to 0', () => {
+    const date = normalizeDateTime(new Date('2000-11-29T12:34:56'));
+
+    expect(date.getFullYear()).to.equal(2000);
+    expect(date.getMonth()).to.equal(10);
+    expect(date.getDate()).to.equal(29);
+    // normalized parts
+    expect(date.getHours()).to.equal(0);
+    expect(date.getMinutes()).to.equal(0);
+    expect(date.getSeconds()).to.equal(0);
+  });
+});

package/components/localize/test/date/parseDate.test.js

@@ -0,0 +1,66 @@
+import { expect } from '@open-wc/testing';
+import { parseDate, localize } from '@lion/ui/localize.js';
+import { localizeTearDown } from '@lion/ui/localize-test-helpers.js';
+
+/**
+ *
+ * @param {Date | undefined} value
+ * @param {Date} date
+ */
+function equalsDate(value, date) {
+  return (
+    Object.prototype.toString.call(value) === '[object Date]' && // is Date Object
+    value &&
+    value.getDate() === date.getDate() && // day
+    value.getMonth() === date.getMonth() && // month
+    value.getFullYear() === date.getFullYear() // year
+  );
+}
+
+describe('parseDate()', () => {
+  beforeEach(() => {
+    localizeTearDown();
+  });
+
+  it('adds leading zeros', () => {
+    expect(equalsDate(parseDate('1-1-1979'), new Date('1979/01/01'))).to.equal(true);
+    expect(equalsDate(parseDate('1-11-1979'), new Date('1979/11/01'))).to.equal(true);
+  });
+
+  it('creates a date object', () => {
+    expect(parseDate('10/10/2000') instanceof Date).to.equal(true);
+  });
+
+  it('returns a date object', () => {
+    expect(equalsDate(parseDate('1-1-1979'), new Date('1979/01/01'))).to.equal(true);
+    expect(equalsDate(parseDate('31.12.1970'), new Date('1970/12/31'))).to.equal(true);
+  });
+
+  it('handles all kind of delimiters', () => {
+    expect(equalsDate(parseDate('12-12-1976'), new Date('1976/12/12'))).to.equal(true);
+    expect(equalsDate(parseDate('13 12 1976'), new Date('1976/12/13'))).to.equal(true);
+    expect(equalsDate(parseDate('14.12.1976'), new Date('1976/12/14'))).to.equal(true);
+    expect(equalsDate(parseDate('14. 12. 1976.'), new Date('1976/12/14'))).to.equal(true);
+    expect(equalsDate(parseDate('14.12.1976 r.'), new Date('1976/12/14'))).to.equal(true);
+  });
+
+  it('handles different locales', () => {
+    localize.locale = 'en-GB';
+    expect(equalsDate(parseDate('31-12-1976'), new Date('1976/12/31'))).to.equal(true);
+    localize.locale = 'en-US';
+    expect(equalsDate(parseDate('12-31-1976'), new Date('1976/12/31'))).to.equal(true);
+  });
+
+  it('return undefined when no valid date provided', () => {
+    expect(parseDate('12.12.1976.,')).to.equal(undefined); // wrong delimiter
+    expect(parseDate('foo')).to.equal(undefined); // no date
+
+    localize.locale = 'en-GB';
+    expect(parseDate('31.02.2020')).to.equal(undefined); // non existing date
+    expect(parseDate('12.31.2020')).to.equal(undefined); // day & month switched places
+
+    localize.locale = 'en-US';
+    expect(parseDate('02.31.2020')).to.equal(undefined); // non existing date
+    expect(parseDate('31.12.2020')).to.equal(undefined); // day & month switched places
+  });
+});

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

@@ -0,0 +1,33 @@
+import { expect } from '@open-wc/testing';
+
+import isLocalizeESModule from '../src/isLocalizeESModule.js';
+
+describe('isLocalizeESModule', () => {
+  it('detects a module by finding the "default" key containing an object', () => {
+    expect(isLocalizeESModule({ default: {} })).to.equal(true);
+  });
+
+  it('detects a real ES module with a default export', async () => {
+    const mod = await import('./test-esmodule-default.js');
+    expect(isLocalizeESModule(mod)).to.equal(true);
+  });
+
+  it('ignores if the "default" key is a string', () => {
+    expect(isLocalizeESModule({ default: 'my string' })).to.equal(false);
+  });
+
+  it('ignores if there are extra keys to the "default" key', () => {
+    expect(isLocalizeESModule({ default: {}, otherKey: 'other key' })).to.equal(false);
+    expect(isLocalizeESModule({ default: {}, otherKey: {} })).to.equal(false);
+  });
+
+  it('ignores if there is no "default" key', () => {
+    expect(isLocalizeESModule({ otherKey: 'other key' })).to.equal(false);
+    expect(isLocalizeESModule({ otherKey: {} })).to.equal(false);
+  });
+
+  it('ignores if not an object', () => {
+    // @ts-ignore passing a non-object is not allowed by ts, but we still want to test the outcome
+    expect(isLocalizeESModule(undefined)).to.equal(false);
+  });
+});

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

@@ -0,0 +1,55 @@
+import { expect } from '@open-wc/testing';
+import sinon from 'sinon';
+
+import { localize, setLocalize, LocalizeManager } from '@lion/ui/localize.js';
+
+/**
+ * @param {LocalizeManager} localizeManagerEl
+ */
+function getProtectedMembers(localizeManagerEl) {
+  // @ts-ignore
+  const { _autoLoadOnLocaleChange: autoLoadOnLocaleChange, _fallbackLocale: fallbackLocale } =
+    localizeManagerEl;
+  return {
+    autoLoadOnLocaleChange,
+    fallbackLocale,
+  };
+}
+
+describe('localize', () => {
+  // this is an important mindset:
+  // we don't test the singleton
+  // we check that it is an instance of the right class
+  // we test newly created instances of this class separately
+  // this allows to avoid any side effects caused by changing singleton state between tests
+
+  it('is an instance of LocalizeManager', () => {
+    expect(localize).to.be.an.instanceOf(LocalizeManager);
+  });
+
+  it('is overridable globally', () => {
+    const oldLocalize = localize;
+    const oldLocalizeTeardown = localize.teardown;
+    localize.teardown = sinon.spy();
+
+    const newLocalize = /** @type {LocalizeManager} */ ({ teardown: () => {} });
+    setLocalize(newLocalize);
+    expect(localize).to.equal(newLocalize);
+
+    // @ts-ignore since we're testing another reference to the same global instance
+    expect(oldLocalize.teardown.callCount).to.equal(1);
+
+    setLocalize(oldLocalize);
+    localize.teardown = oldLocalizeTeardown;
+  });
+
+  it('is configured to automatically load namespaces if locale is changed', () => {
+    const { autoLoadOnLocaleChange } = getProtectedMembers(localize);
+    expect(autoLoadOnLocaleChange).to.equal(true);
+  });
+
+  it('is configured to fallback to the locale "en-GB"', () => {
+    const { fallbackLocale } = getProtectedMembers(localize);
+    expect(fallbackLocale).to.equal('en-GB');
+  });
+});