webawesome/src/components/format-bytes/format-bytes.test.ts

import { elementUpdated, expect } from '@open-wc/testing';
import { fixtures } from '../../internal/test/fixture.js';
import { html } from 'lit';
import type WaFormatBytes from './format-bytes.js';

describe('<wa-format-bytes>', () => {
  for (const fixture of fixtures) {
    describe(`with "${fixture.type}" rendering`, () => {
      describe('defaults ', () => {
        it('default properties', async () => {
          const el = await fixture<WaFormatBytes>(html` <wa-format-bytes></wa-format-bytes> `);

          expect(el.value).to.equal(0);
          expect(el.unit).to.equal('byte');
          expect(el.display).to.equal('short');
          expect(el.lang).to.be.undefined;
        });
      });

      describe('bytes', () => {
        const results = [
          {
            value: 12,
            short: '12 byte',
            long: '12 bytes',
            narrow: '12B'
          },
          {
            value: 1200,
            short: '1.2 kB',
            long: '1.2 kilobytes',
            narrow: '1.2kB'
          },
          {
            value: 1200000,
            short: '1.2 MB',
            long: '1.2 megabytes',
            narrow: '1.2MB'
          },
          {
            value: 1200000000,
            short: '1.2 GB',
            long: '1.2 gigabytes',
            narrow: '1.2GB'
          }
        ];

        results.forEach(expected => {
          it('bytes : display formats', async () => {
            const el = await fixture<WaFormatBytes>(html` <wa-format-bytes></wa-format-bytes> `);
            // short
            el.value = expected.value;
            await elementUpdated(el);
            expect(el.shadowRoot?.textContent).to.equal(expected.short);

            // long
            el.display = 'long';
            el.value = expected.value;
            await elementUpdated(el);
            expect(el.shadowRoot?.textContent).to.equal(expected.long);

            // narrow
            el.display = 'narrow';
            el.value = expected.value;
            await elementUpdated(el);
            expect(el.shadowRoot?.textContent).to.equal(expected.narrow);
          });
        });
      });

      describe('bits', () => {
        const results = [
          {
            value: 12,
            short: '12 bit',
            long: '12 bits',
            narrow: '12bit'
          },
          {
            value: 1200,
            short: '1.2 kb',
            long: '1.2 kilobits',
            narrow: '1.2kb'
          },
          {
            value: 1200000,
            short: '1.2 Mb',
            long: '1.2 megabits',
            narrow: '1.2Mb'
          },
          {
            value: 1200000000,
            short: '1.2 Gb',
            long: '1.2 gigabits',
            narrow: '1.2Gb'
          }
        ];

        results.forEach(expected => {
          it('bits : display formats', async () => {
            const el = await fixture<WaFormatBytes>(html` <wa-format-bytes unit="bit"></wa-format-bytes> `);
            // short
            el.value = expected.value;
            await elementUpdated(el);
            expect(el.shadowRoot?.textContent).to.equal(expected.short);

            // long
            el.display = 'long';
            el.value = expected.value;
            await elementUpdated(el);
            expect(el.shadowRoot?.textContent).to.equal(expected.long);

            // narrow
            el.display = 'narrow';
            el.value = expected.value;
            await elementUpdated(el);
            expect(el.shadowRoot?.textContent).to.equal(expected.narrow);
          });
        });
      });
    });
  }
});