index_spec.js 2.62 KB
Newer Older
1 2 3 4 5 6 7
import Vue from 'vue';
import CodeComponent from '~/notebook/cells/output/index.vue';

const Component = Vue.extend(CodeComponent);

describe('Output component', () => {
  let vm;
8
  let json;
9

Mike Greiling's avatar
Mike Greiling committed
10
  const createComponent = output => {
11 12
    vm = new Component({
      propsData: {
13
        outputs: [].concat(output),
14 15 16 17 18 19
        count: 1,
      },
    });
    vm.$mount();
  };

20 21 22 23
  beforeEach(() => {
    json = getJSONFixture('blob/notebook/basic.json');
  });

24
  describe('text output', () => {
Mike Greiling's avatar
Mike Greiling committed
25
    beforeEach(done => {
26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42
      createComponent(json.cells[2].outputs[0]);

      setTimeout(() => {
        done();
      });
    });

    it('renders as plain text', () => {
      expect(vm.$el.querySelector('pre')).not.toBeNull();
    });

    it('renders promot', () => {
      expect(vm.$el.querySelector('.prompt span')).not.toBeNull();
    });
  });

  describe('image output', () => {
Mike Greiling's avatar
Mike Greiling committed
43
    beforeEach(done => {
44 45 46 47 48 49 50 51 52 53 54 55 56
      createComponent(json.cells[3].outputs[0]);

      setTimeout(() => {
        done();
      });
    });

    it('renders as an image', () => {
      expect(vm.$el.querySelector('img')).not.toBeNull();
    });
  });

  describe('html output', () => {
57
    it('renders raw HTML', () => {
58 59 60
      createComponent(json.cells[4].outputs[0]);

      expect(vm.$el.querySelector('p')).not.toBeNull();
61 62
      expect(vm.$el.querySelectorAll('p').length).toBe(1);
      expect(vm.$el.textContent.trim()).toContain('test');
63 64
    });

65 66 67 68
    it('renders multiple raw HTML outputs', () => {
      createComponent([json.cells[4].outputs[0], json.cells[4].outputs[0]]);

      expect(vm.$el.querySelectorAll('p').length).toBe(2);
69 70 71 72
    });
  });

  describe('svg output', () => {
Mike Greiling's avatar
Mike Greiling committed
73
    beforeEach(done => {
74 75 76 77 78 79 80 81 82 83 84 85 86
      createComponent(json.cells[5].outputs[0]);

      setTimeout(() => {
        done();
      });
    });

    it('renders as an svg', () => {
      expect(vm.$el.querySelector('svg')).not.toBeNull();
    });
  });

  describe('default to plain text', () => {
Mike Greiling's avatar
Mike Greiling committed
87
    beforeEach(done => {
88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103
      createComponent(json.cells[6].outputs[0]);

      setTimeout(() => {
        done();
      });
    });

    it('renders as plain text', () => {
      expect(vm.$el.querySelector('pre')).not.toBeNull();
      expect(vm.$el.textContent.trim()).toContain('testing');
    });

    it('renders promot', () => {
      expect(vm.$el.querySelector('.prompt span')).not.toBeNull();
    });

Mike Greiling's avatar
Mike Greiling committed
104
    it("renders as plain text when doesn't recognise other types", done => {
105 106 107 108 109 110 111 112 113 114 115
      createComponent(json.cells[7].outputs[0]);

      setTimeout(() => {
        expect(vm.$el.querySelector('pre')).not.toBeNull();
        expect(vm.$el.textContent.trim()).toContain('testing');

        done();
      });
    });
  });
});