Skip to content

Commit

Permalink
fix(i18n.update-translations.spec.js): set locale before testing to b…
Browse files Browse the repository at this point in the history
…e sure 1st translation is applied
  • Loading branch information
Jenselme committed Jul 11, 2016
1 parent 8cc4f9f commit 0496b41
Show file tree
Hide file tree
Showing 2 changed files with 106 additions and 98 deletions.
16 changes: 8 additions & 8 deletions test/unit/fixtures/template.html
Original file line number Diff line number Diff line change
@@ -1,39 +1,39 @@
<template>

<h1 t="title" id="test1">Title</h1>
<h1 t="title" id="test1">WrongTitle</h1>

<p t="description" id="test2">
Description
Wrong Description
</p>

<p t="nested_referencing" id="test-nested">
Description Title
</p>-

<p data-i18n="description" id="test-other-attr">
Description
Wrong Description
</p>

<p t="[text]description" id="test-text">
Description
Wrong Description
</p>

<p t="description2" id="test-text-with-tags">
Description <b>with some bold</b>
Wrong Description <b>with some bold</b>
</p>

<p t="[html]description2" id="test-html">
Description <b>with some bold</b>
Wrong Description <b>with some bold</b>
</p>

<p t="[prepend]description2" id="test-prepend">content</p>

<p t="[append]description2" id="test-append">content</p>

<p t="[html]description2;[class]description-class" id="test-multiple">
Description <b>with some bold</b>
Wrong Description <b>with some bold</b>
</p>

<img data-src="testimage-english.jpg" t="testimage" id="test-img"/>
<img data-src="wrong-testimage-english.jpg" t="testimage" id="test-img"/>

</template>
188 changes: 98 additions & 90 deletions test/unit/i18n.update-translations.spec.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ describe('testing i18n translation update', () => {
let template;
let ea;

beforeEach((done) => {
beforeEach(done => {
System.config({
'paths': {
'fixture:*': 'test/unit/fixtures/*.js'
Expand Down Expand Up @@ -65,98 +65,106 @@ describe('testing i18n translation update', () => {
});


it('should not update translations if no attributes defined in options', (done) => {
ea = new EventAggregator();
sut = new I18N(ea, new BindingSignaler());
sut.setup({
resStore: resources,
lng: 'en',
getAsync: false,
sendMissing: false,
fallbackLng: 'en',
debug: false
});

//load the the html fixture
System.import('fixture:template.html!text').then((result) => {
template = document.createElement('div');
template.innerHTML = result;
if (template.firstChild instanceof HTMLTemplateElement) template.innerHTML = template.firstChild.innerHTML;
document.body.appendChild(template);
done();
});

expect(template.querySelector('#test1').innerHTML.trim()).toBe('Title');
expect(template.querySelector('#test2').innerHTML.trim()).toBe('Description');
sut.setLocale('de');
expect(template.querySelector('#test1').innerHTML.trim()).toBe('Title');
expect(template.querySelector('#test2').innerHTML.trim()).toBe('Description');
});

it('should translate contents of elements with a translation attribute', done => {
expect(template.querySelector('#test1').innerHTML.trim()).toBe('Title');
expect(template.querySelector('#test2').innerHTML.trim()).toBe('Description');
sut.setLocale('de').then(() => {
expect(template.querySelector('#test1').innerHTML.trim()).toBe('Titel');
expect(template.querySelector('#test2').innerHTML.trim()).toBe('Beschreibung');
done();
});
});

it('should translate nested keys', done => {
expect(template.querySelector('#test-nested').innerHTML.trim()).toBe('Description Title');
sut.setLocale('de').then(() => {
expect(template.querySelector('#test-nested').innerHTML.trim()).toBe('Der Titel ist der Kopf');
done();
});
});

it('should work with all attributes specified in the options', done => {
let el = template.querySelector('#test-other-attr');
expect(el.innerHTML.trim()).toBe('Description');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung');
done();
});
});

it('should set the textContent when using the [text] attribute', done => {
let el = template.querySelector('#test-text');
expect(el.innerHTML.trim()).toBe('Description');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung');
done();
});
});

it('should escape html tags by default or when using [text]', done => {
let el = template.querySelector('#test-text-with-tags');
expect(el.innerHTML.trim()).toBe('Description <b>with some bold</b>');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung &lt;b&gt;mit Fettdruck&lt;/b&gt;');
done();
});
});

it('should allow tags when using the [html] attribute', done => {
let el = template.querySelector('#test-html');
expect(el.innerHTML.trim()).toBe('Description <b>with some bold</b>');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung <b>mit Fettdruck</b>');
done();
describe('init locale', () => {
beforeEach(done => {
sut.setLocale('en').then(() => done());
});


it('should not update translations if no attributes defined in options', (done) => {
ea = new EventAggregator();
sut = new I18N(ea, new BindingSignaler());
sut.setup({
resStore: resources,
lng: 'en',
getAsync: false,
sendMissing: false,
fallbackLng: 'en',
debug: false
});

//load the the html fixture
System.import('fixture:template.html!text').then((result) => {
template = document.createElement('div');
template.innerHTML = result;
if (template.firstChild instanceof HTMLTemplateElement)
template.innerHTML = template.firstChild.innerHTML;
document.body.appendChild(template);
done();
});

expect(template.querySelector('#test1').innerHTML.trim()).toBe('Title');
expect(template.querySelector('#test2').innerHTML.trim()).toBe('Description');
sut.setLocale('de');
expect(template.querySelector('#test1').innerHTML.trim()).toBe('Title');
expect(template.querySelector('#test2').innerHTML.trim()).toBe('Description');
});

it('should translate contents of elements with a translation attribute', done => {
expect(template.querySelector('#test1').innerHTML.trim()).toBe('Title');
expect(template.querySelector('#test2').innerHTML.trim()).toBe('Description');
sut.setLocale('de').then(() => {
expect(template.querySelector('#test1').innerHTML.trim()).toBe('Titel');
expect(template.querySelector('#test2').innerHTML.trim()).toBe('Beschreibung');
done();
});
});

it('should translate nested keys', done => {
expect(template.querySelector('#test-nested').innerHTML.trim()).toBe('The Title is the header');
sut.setLocale('de').then(() => {
expect(template.querySelector('#test-nested').innerHTML.trim()).toBe('Der Titel ist der Kopf');
done();
});
});

it('should work with all attributes specified in the options', done => {
let el = template.querySelector('#test-other-attr');
expect(el.innerHTML.trim()).toBe('Description');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung');
done();
});
});

it('should set the textContent when using the [text] attribute', done => {
let el = template.querySelector('#test-text');
expect(el.innerHTML.trim()).toBe('Description');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung');
done();
});
});

it('should escape html tags by default or when using [text]', done => {
let el = template.querySelector('#test-text-with-tags');
expect(el.innerHTML.trim()).toBe('Description &lt;b&gt;with some bold&lt;/b&gt;');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung &lt;b&gt;mit Fettdruck&lt;/b&gt;');
done();
});
});

it('should allow tags when using the [html] attribute', done => {
let el = template.querySelector('#test-html');
expect(el.innerHTML.trim()).toBe('Description <b>with some bold</b>');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung <b>mit Fettdruck</b>');
done();
});
});
});

it('should prepend the translation when using the [prepend] attribute, and it allows html', done => {
let el = template.querySelector('#test-prepend');
expect(el.innerHTML.trim()).toBe('content');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung <b>mit Fettdruck</b>content');
return sut.setLocale('en');
}).then(() => {
expect(el.innerHTML.trim()).toBe('Description <b>with some bold</b>content');
done();
});
let el = template.querySelector('#test-prepend');
expect(el.innerHTML.trim()).toBe('content');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung <b>mit Fettdruck</b>content');
return sut.setLocale('en');
}).then(() => {
expect(el.innerHTML.trim()).toBe('Description <b>with some bold</b>content');
done();
});
});

it('should append the translation when using the [append] attribute, and it allows html', done => {
Expand All @@ -173,7 +181,7 @@ describe('testing i18n translation update', () => {

it('should set multiple keys when separated with a semicolon', done => {
let el = template.querySelector('#test-multiple');
expect(el.innerHTML.trim()).toBe('Description <b>with some bold</b>');
expect(el.innerHTML.trim()).toBe('Wrong Description <b>with some bold</b>');
expect(el.className).toBe('');
sut.setLocale('de').then(() => {
expect(el.innerHTML.trim()).toBe('Beschreibung <b>mit Fettdruck</b>');
Expand Down

0 comments on commit 0496b41

Please sign in to comment.