import Viewer3crWebGL from '@/components/modal/Viewer3crWebGL.vue';
import { createInstance, registerOnPayloadHandler } from '@3cr/sdk-browser';
import { mount } from '@vue/test-utils';
import { nextTick } from 'vue';

describe('Viewer3crWebGL spec', () => {
  const navigator = {
    userAgent: 'Android',
    storage: {
      estimate() {
        return Promise.resolve({ usage: 100, quota: 100 });
      },
    },
  };

  it('creates instance', async () => {
    mount(Viewer3crWebGL);
    await nextTick();
    expect(createInstance).toHaveBeenCalled();
    expect(registerOnPayloadHandler).toHaveBeenCalled();
  });

  it('should emit wheel event', () => {
    const wrapper = mount(Viewer3crWebGL);
    const overlay = wrapper.find('#canvas');
    overlay.trigger('wheel');
    expect(wrapper.emitted('wheel')).toBeTruthy();
  });

  it('should emit mouseover event', () => {
    const wrapper = mount(Viewer3crWebGL);
    const overlay = wrapper.find('#canvas');
    overlay.trigger('mouseover');
    expect(wrapper.emitted('mouseover')).toBeTruthy();
  });

  it('should emit mouseout event', () => {
    const wrapper = mount(Viewer3crWebGL);
    const overlay = wrapper.find('#canvas');
    overlay.trigger('mouseover');
    overlay.trigger('mouseout');
    expect(wrapper.emitted('mouseover')).toBeTruthy();
    expect(wrapper.emitted('mouseout')).toBeTruthy();
  });

  it('should test user agent', () => {
    vi.spyOn(globalThis, 'navigator', 'get').mockReturnValue(navigator as any);
    mount(Viewer3crWebGL);
    expect(document.head.children.length > 0).toBeTruthy();
  });

  it('should test storage', () => {
    vi.spyOn(globalThis, 'navigator', 'get').mockReturnValue(navigator as any);
    mount(Viewer3crWebGL);
    expect(globalThis.navigator.storage).toBeTruthy();
  });
});