import { mount } from '@vue/test-utils';
import store from 'kolibri.coreVue.vuex.store';
import TopBar from '../src/views/TopBar';

function createWrapper({ title, isInFullscreen = false } = {}) {
  return mount(TopBar, {
    propsData: {
      title,
      isInFullscreen,
    },
    store,
  });
}

describe('Top bar', () => {
  it('should mount', () => {
    const wrapper = createWrapper();
    expect(wrapper.exists()).toBe(true);
  });
  it('should not have a heading if a title is not passed in', () => {
    const wrapper = createWrapper();
    expect(wrapper.contains('h2')).toBe(false);
  });
  it('should have a heading if a title is passed in', () => {
    const title = 'Book title';
    const wrapper = createWrapper({ title });
    expect(wrapper.contains('h2')).toBe(true);
  });
  it('should allow parent to focus on table of contents button', () => {
    const wrapper = createWrapper();
    wrapper.vm.focusOnTocButton();
    const elementThatIsFocused = document.activeElement;
    expect(elementThatIsFocused.getAttribute('data-test')).toEqual('toc button');
  });
  it('should allow parent to focus on settings button', () => {
    const wrapper = createWrapper();
    wrapper.vm.focusOnSettingsButton();
    const elementThatIsFocused = document.activeElement;
    expect(elementThatIsFocused.getAttribute('data-test')).toEqual('settings button');
  });
  it('should allow parent to focus on search button', () => {
    const wrapper = createWrapper();
    wrapper.vm.focusOnSearchButton();
    const elementThatIsFocused = document.activeElement;
    expect(elementThatIsFocused.getAttribute('data-test')).toEqual('search button');
  });

  it('should emit and event when the table of contents button is clicked', () => {
    const wrapper = createWrapper();
    wrapper.find({ name: 'TocButton' }).trigger('click');
    expect(wrapper.emitted().tableOfContentsButtonClicked).toBeTruthy();
  });
  it('should emit and event when the settings button is clicked', () => {
    const wrapper = createWrapper();
    wrapper.find({ name: 'SettingsButton' }).trigger('click');
    expect(wrapper.emitted().settingsButtonClicked).toBeTruthy();
  });
  it('should emit and event when the search button is clicked', () => {
    const wrapper = createWrapper();
    wrapper.find({ name: 'SearchButton' }).trigger('click');
    expect(wrapper.emitted().searchButtonClicked).toBeTruthy();
  });
  it('should emit and event when the fullscreen button is clicked', () => {
    const wrapper = createWrapper();
    wrapper.find({ ref: 'fullscreenButton' }).trigger('click');
    expect(wrapper.emitted().fullscreenButtonClicked).toBeTruthy();
  });
});

@@ -565,34 +565,38 @@
 per.
-contains
+find
 ('h2')
+.element
 ).toBe
-(false
+Falsy(
 );%0A 
@@ -763,33 +763,39 @@
 per.
-contains
+find
 ('h2')
-).toBe(true
+.element).toBeTruthy(
 );%0A 
@@ -1794,32 +1794,41 @@
     wrapper.find
+Component
 (%7B name: 'TocBut
@@ -1845,32 +1845,32 @@
 igger('click');%0A
-
     expect(wrapp
@@ -2051,32 +2051,41 @@
     wrapper.find
+Component
 (%7B name: 'Settin
@@ -2312,16 +2312,25 @@
 per.find
+Component
 (%7B name:
@@ -2541,32 +2541,32 @@
 reateWrapper();%0A
-
     wrapper.find
@@ -2565,16 +2565,25 @@
 per.find
+Component
 (%7B ref: 

Upgrade TopBar specs