import { expect }   from 'chai';
import React        from 'react';
import fillTemplate from '../fill_template';

describe('fillTemplate', () => {
    it('works for string without tags', () => {
        expect(fillTemplate('hello world'))
            .to.eql(['hello world']);
    });
    it('works for 1 tag at the start replaced with string', () => {
        expect(fillTemplate('[_1] is no spoon', { '1': 'there' }))
            .to.eql(['there is no spoon']);
    });
    it('works for 1 tag at the start replaced with component', () => {
        const span = <span className='amazing-text'>There</span>;
        expect(fillTemplate('[_1] is no spoon', { '1': span }))
            .to.eql([span, ' is no spoon']);
    });
    it('works for 1 tag in the middle replaced with string', () => {
        expect(fillTemplate('there is [_1] spoon', { '1': 'no' }))
            .to.eql(['there is no spoon']);
    });
    it('works for 1 tag in the middle replaced with component', () => {
        const a = <a href='javascript:;'>no</a>;
        expect(fillTemplate('there is [_1] spoon', { '1': a }))
            .to.eql(['there is ', a, ' spoon']);
    });
    it('works for 1 tag at the end replaced with string', () => {
        expect(fillTemplate('there is no [_1]', { '1': 'spoon' }))
            .to.eql(['there is no spoon']);
    });
    it('works for 1 tag at the end replaced with component', () => {
        const div = <div className='test' />;
        expect(fillTemplate('there is no [_1]', { '1': div }))
            .to.eql(['there is no ', div]);
    });
    it('works for 2 tags replaced with strings', () => {
        expect(fillTemplate('[_1] think therefore [_1] am', { '1': 'I' }))
            .to.eql(['I think therefore I am']);
    });
    it('works for 2 tags replaced with component', () => {
        const img = <img src='images/avatar.jpg' />;
        expect(fillTemplate('[_1] think therefore [_1] am', { '1': img }))
            .to.eql([img, ' think therefore ', img, ' am']);
    });
    it('works for 1 pair tag replaced with component', () => {
        const Link = ({ children }) => <a className='link' href='javascript:;'>{ children }</a>;
        const result = fillTemplate('These [_1]violent delights[_2] have violent ends.', { '1_2': <Link /> });
        expect(result)
            .to.have.lengthOf(3)
            .to.eql(['These ', <Link key={result[1].key}>violent delights</Link>, ' have violent ends.']);
    });
});

@@ -2450,12 +2450,503 @@
     %7D);%0A
+    it('works for 2 pair tags replaced with components', () =%3E %7B%0A        const Link = (%7B children %7D) =%3E %3Ca className='link' href='javascript:;'%3E%7B children %7D%3C/a%3E;%0A        const result = fillTemplate('These %5B_1%5Dviolent delights%5B_2%5D have %5B_1%5Dviolent ends%5B_2%5D.', %7B '1_2': %3CLink /%3E %7D);%0A        expect(result)%0A            .to.have.lengthOf(5)%0A            .to.eql(%5B'These ', %3CLink key=%7Bresult%5B1%5D.key%7D%3Eviolent delights%3C/Link%3E, ' have ', %3CLink key=%7Bresult%5B3%5D.key%7D%3Eviolent ends%3C/Link%3E, '.'%5D);%0A    %7D);%0A
 %7D);%0A

test 2 pair tags