Skip to content

Commit

Permalink
tests
Browse files Browse the repository at this point in the history
  • Loading branch information
Claudio Benedetti committed Jan 19, 2024
1 parent 20ace01 commit 690f70f
Show file tree
Hide file tree
Showing 3 changed files with 151 additions and 35 deletions.
72 changes: 68 additions & 4 deletions src/base/__tests__/localized-components.tets.ts
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import {mergeLocales} from '../localized-components'
import {localizeObj, mergeLocales} from '../localized-components'

describe('localized-components tests', () => {
const defaultLocale = {
Expand Down Expand Up @@ -68,9 +68,35 @@ describe('localized-components tests', () => {

expect(merged).toStrictEqual(expected)
})

it('should localize object', () => {
expect(localizeObj(defaultLocale)).toStrictEqual({
title: 'title-en',
subtitle: {
subtitle: 'subtitle-en',
badge: 'badge-en'
}
})
expect(localizeObj({es: {}})).toBeUndefined()
expect(localizeObj({})).toBeUndefined()
expect(localizeObj(undefined)).toBeUndefined()
})
it('should localize object', () => {
const {navigator} = window
Object.defineProperty(window, 'navigator', {writable: true, value: {language: 'it'}})

expect(localizeObj(defaultLocale)).toStrictEqual({
title: 'title-it',
subtitle: {
subtitle: 'subtitle-it',
badge: 'badge-it'
}
})

Object.defineProperty(window, 'navigator', {writable: true, value: navigator})
})

it('should be robust to wrong config', () => {

const wrongLocale = {
...locale,
en: {
Expand All @@ -84,8 +110,46 @@ describe('localized-components tests', () => {
}

// @ts-expect-error force wrong config
const merged = mergeLocales(wrongLocale, defaultLocale)
expect(mergeLocales(wrongLocale, defaultLocale)).toStrictEqual(merged)
})

expect(merged).toStrictEqual(merged)
it('should be robust to wrong config', () => {
const wrongLocale = {
...locale,
en: {
title: 0,
subtitle: {
subtitle: 'subtitle-en-2',
},
footer: 'footer-en-2'
}
}

// @ts-expect-error force wrong config
expect(mergeLocales(wrongLocale, defaultLocale)).toStrictEqual(
{
es: {
title: 'title-es',
subtitle: {
subtitle: 'subtitle-es',
badge: 'badge-es'
}
},
en: {
title: 'title-en',
subtitle: {
subtitle: 'subtitle-en-2',
badge: 'badge-en'
},
footer: 'footer-en-2'
},
it: {
title: 'title-it',
subtitle: {
subtitle: 'subtitle-it',
badge: 'badge-it'
}
},
})
})
})
14 changes: 8 additions & 6 deletions src/base/localized-components.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,6 @@ function mergeLabels <L extends Labels> (labels: L, defaultLabels: L): L {
const keys = unique(
Object.keys(labels).concat(Object.keys(defaultLabels))
)

return keys.reduce<Labels>((acc, key) => {
const value = labels[key]
const defaultValue = defaultLabels[key]
Expand All @@ -31,11 +30,6 @@ function mergeLabels <L extends Labels> (labels: L, defaultLabels: L): L {
return acc
}

if (typeof value === 'undefined') {
acc[key] = defaultValue
return acc
}

if (typeof value === 'object' && typeof defaultValue === 'object') {
acc[key] = mergeLabels(value, defaultValue)
return acc
Expand All @@ -46,6 +40,14 @@ function mergeLabels <L extends Labels> (labels: L, defaultLabels: L): L {
return acc
}

if (typeof value !== 'string'
&& typeof value !== 'object'
&& (typeof defaultValue === 'string' || typeof defaultValue === 'object')
) {
acc[key] = defaultValue
return acc
}

return acc
}, {}) as L
}
Expand Down
100 changes: 75 additions & 25 deletions test/e2e/localized.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,6 @@ import {
import {customElement, query} from 'lit/decorators.js'
import React from 'react'

// import {BkBase} from '../../src/base/bk-base'
import {BkComponent} from '../../src/base/bk-component'

type ComponentLabels = {
Expand Down Expand Up @@ -35,9 +34,9 @@ class LocalComponent extends BkComponent<Record<string, any>, ComponentLabels> {
return React.createElement(
'div', {id: 'parent', ...props},
[
React.createElement('div', {id: 'name', key: 'name', ...props}, props.locale.name),
React.createElement('div', {id: 'text', key: 'text', ...props}, props.locale.body.text),
React.createElement('div', {id: 'badge', key: 'badge', ...props}, props.locale.body.badge),
React.createElement('div', {id: 'name', key: 'name', ...props}, props.locale?.name ?? ''),
React.createElement('div', {id: 'text', key: 'text', ...props}, props.locale?.body.text ?? ''),
React.createElement('div', {id: 'badge', key: 'badge', ...props}, props.locale?.body.badge ?? ''),
]
)
},
Expand All @@ -53,7 +52,7 @@ class LocalComponent extends BkComponent<Record<string, any>, ComponentLabels> {
}

@customElement('defaulted-localized-component')
class DefaultedLocalComponent extends LocalComponent {
class WithDefaultLocalComponent extends LocalComponent {
defaultLocale = {
en: {
name: 'default-name',
Expand All @@ -65,7 +64,7 @@ class DefaultedLocalComponent extends LocalComponent {
}
}

describe('style tests', () => {
describe('localization tests', () => {
it('should apply custom locale', async () => {
const el = await fixture(html`
<localized-component
Expand All @@ -87,7 +86,27 @@ describe('style tests', () => {
expect(el.text).to.be.to.have.text('custom-text')
expect(el.badge).to.be.to.have.text('custom-badge')
})


it('should apply no locale', async () => {
const el = await fixture(html`
<localized-component></localized-component>
`) as LocalComponent

expect(el.name).to.be.to.have.text('')
expect(el.text).to.be.to.have.text('')
expect(el.badge).to.be.to.have.text('')
})

it('should use default locale', async () => {
const el = await fixture(html`
<defaulted-localized-component></defaulted-localized-component>
`) as WithDefaultLocalComponent

expect(el.name).to.be.to.have.text('default-name')
expect(el.text).to.be.to.have.text('default-text')
expect(el.badge).to.be.to.have.text('default-badge')
})

it('should apply custom locale to default', async () => {
const el = await fixture(html`
<defaulted-localized-component
Expand All @@ -109,36 +128,67 @@ describe('style tests', () => {
}
}
></defaulted-localized-component>
`) as DefaultedLocalComponent
`) as WithDefaultLocalComponent

expect(el.name).to.be.to.have.text('custom-name')
expect(el.text).to.be.to.have.text('default-text')
expect(el.badge).to.be.to.have.text('custom-badge')
})

it('should use default locale', async () => {

it('should apply custom locale to default (it)', async () => {
const {navigator} = window
Object.defineProperty(window, 'navigator', {writable: true, value: {language: 'it'}})

const el = await fixture(html`
<defaulted-localized-component></defaulted-localized-component>
`) as DefaultedLocalComponent
<defaulted-localized-component
.customLocale=${
{
it: {
name: 'name-it',
body: {
text: 'text-it',
badge: 'badge-it'
}
}
}
}
></defaulted-localized-component>
`) as WithDefaultLocalComponent

expect(el.name).to.be.to.have.text('default-name')
expect(el.name).to.be.to.have.text('name-it')
expect(el.text).to.be.to.have.text('text-it')
expect(el.badge).to.be.to.have.text('badge-it')

Object.defineProperty(window, 'navigator', {writable: true, value: navigator})
})

it('should apply custom locale to default (partial locale)', async () => {
const el = await fixture(html`
<defaulted-localized-component
.customLocale=${
{
en: {name: 'custom-name'}
}
}
></defaulted-localized-component>
`) as WithDefaultLocalComponent

expect(el.name).to.be.to.have.text('custom-name')
expect(el.text).to.be.to.have.text('default-text')
expect(el.badge).to.be.to.have.text('default-badge')
})

it('should apply custom locale to default', async () => {
const {navigator} = window
Object.defineProperty(window, 'navigator', {writable: true, value: {language: 'it'}})

it('should be robust to wrong custom locale', async () => {
const el = await fixture(html`
<defaulted-localized-component
.customLocale=${
{
en: {
name: 'custom-name',
name: 0, // should use default
body: {
badge: 'custom-badge'
}
},
wrong: 0 // should be ignored
},
it: {
name: 'name-it',
Expand All @@ -150,12 +200,12 @@ describe('style tests', () => {
}
}
></defaulted-localized-component>
`) as DefaultedLocalComponent
`) as WithDefaultLocalComponent

expect(el.name).to.be.to.have.text('name-it')
expect(el.text).to.be.to.have.text('text-it')
expect(el.badge).to.be.to.have.text('badge-it')

Object.defineProperty(window, 'navigator', {writable: true, value: navigator})
expect(el.name).to.be.to.have.text('default-name')
expect(el.text).to.be.to.have.text('default-text')
expect(el.badge).to.be.to.have.text('custom-badge')
// @ts-expect-error wrong conifg should not be applied
expect(el.locale?.wrong).to.be.undefined
})
})

0 comments on commit 690f70f

Please sign in to comment.