// jshint esversion: 6
'use strict';

import React from 'react';
import {List} from './List';
import Store from '../../../data/Store';
import {mount} from '../../../../build/enzyme';

class MyList extends List {
    renderItem(item, index) {
        return <span key={index}>{item.value}</span>;
    }
    render() {
        const r = super.render();
        return <div>{r}</div>;
    }
}

const storeFields = [{id: 'id', type: 'number'}, {id: 'value', type: 'string'}];

const storeItems = [{id: 1, value: 'Alpha'}, {id: 2, value: 'Bravo'}, {id: 3, value: 'Charlie'}];

describe('List', () => {
    it('renders list of items', () => {
        const store = new Store({fields: storeFields});

        store.setItems(storeItems);

        const props = {store};
        const wrapper = mount(<MyList {...props} />);
        const actualTexts = wrapper.find('span').map(item => item.text());
        const expectedText = storeItems.map(item => item.value);

        expect(actualTexts).toEqual(expectedText);
    });

    it('renders empty message', () => {
        const store = new Store({fields: storeFields});

        store.setItems([]);

        const props = {
            noResultsText: 'no results',
            store
        };
        const wrapper = mount(<MyList {...props} />);
        const actualText = wrapper.text();
        const expectedText = props.noResultsText;

        expect(actualText).toBe(expectedText);
    });
});
