// test utils
import { mount, shallow } from 'enzyme';
// Components
import {SearchBar,SearchBarScopeSelection, SearchBarInput} from '../searchbar';

describe('SearchBar components ', () => {
    describe('<SearchBarInput />', ()=> {
        it('should call the query props on the change event ', () => {
            const searchbarSpy = sinon.spy();
            const wrapper = shallow(<SearchBarInput queryAction={searchbarSpy}/>);
            wrapper.find("[data-focus='search-bar-input']").simulate('change', {target: {value: 'My new value'}})
            expect(searchbarSpy).to.have.property('callCount', 1);
            expect(searchbarSpy).to.have.been.calledWith()
        });
    });
    describe('<SearchBarScopeSelection />', ()=> {
        const spy = sinon.spy();
        const scopes = [{value: 'TOTO', label: 'Toto'}, {value: 'TITI', label: 'Titi'}, {value: 'TATA', label: 'Tata'}];
        const component = <SearchBarScopeSelection scope='TOTO' scopes={scopes} scopeAction={spy} />;
        it('should shallow [data-focus=\'search-bar-scope-selection\']', () => {
            const shallowWrapper = shallow(component);
            expect(shallowWrapper.find("[data-focus='search-bar-scope-selection']")).to.have.length(1);
        });
        it('should have 3 scopes corresponding to 3 values in props', () => {
            const shallowMount = mount(component);
            const selectInput = shallowMount.find("[data-focus='select-mdl']");
            expect(selectInput).to.exist;
            expect(selectInput.find('ul li')).to.have.length(3);
        });
        it('should call the group props on the change event', () => {
            const shallowMount = mount(component);
            const selectInput = shallowMount.find("[data-focus='select-mdl']");
            expect(selectInput).to.exist;
            selectInput.find('ul li').at(0).simulate('click');
            expect(spy).to.have.property('callCount', 1);
            expect(spy).to.have.been.calledWith()
        });
    });
    describe('<SearchBar />', ()=> {
        it('should be a div with a data-focus="action-bar"', () => {
            const wrapper = shallow(<SearchBar/>);
            expect(wrapper.find("[data-focus='search-bar']")).to.have.length(1);
        });
    });
});

@@ -69,17 +69,16 @@
 %0Aimport 
-%7B
 SearchBa
@@ -79,16 +79,18 @@
 archBar,
+ %7B
 SearchBa
@@ -337,32 +337,62 @@
  = sinon.spy();%0A
+            const wait = 200;%0A
             cons
@@ -453,16 +453,40 @@
 hbarSpy%7D
+ queryActionWait=%7Bwait%7D 
 /%3E);%0A   
@@ -595,17 +595,53 @@
 alue'%7D%7D)
+;
 %0A
+            setTimeout(() =%3E %7B%0A    
         
@@ -703,32 +703,36 @@
 1);%0A            
+    
 expect(searchbar
@@ -754,32 +754,54 @@
 en.calledWith()%0A
+            %7D, wait);%0A
         %7D);%0A    
@@ -2223,32 +2223,69 @@
 -bar%22', () =%3E %7B%0A
+            const spy = sinon.spy();%0A
             cons
@@ -2288,39 +2288,37 @@
 const wrapper = 
-shallow
+mount
 (%3CSearchBar/%3E);%0A
@@ -2312,16 +2312,35 @@
 earchBar
+ queryAction=%7Bspy%7D 
 /%3E);%0A   

correct searchbar tests