Add specs

spec/features/projects/blobs/blob_show_spec.rb

@@ -4,19 +4,48 @@ feature 'File blob', feature: true do
   include TreeHelper
 
   let(:project) { create(:project, :public, :test_repo) }
-  let(:merge_request) { create(:merge_request, source_project: project, source_branch: 'feature', target_branch: 'master') }
-  let(:branch) { 'master' }
-  let(:file_path) { project.repository.ls_files(project.repository.root_ref)[1] }
 
-  context 'anonymous' do
-    context 'from blob file path' do
-      before do
-        visit namespace_project_blob_path(project.namespace, project, tree_join(branch, file_path))
+  def visit_blob(path, fragment = nil)
+    visit namespace_project_blob_path(project.namespace, project, tree_join('master', path), anchor: fragment)
   end
 
-      it 'updates content' do
-        expect(page).to have_link  'Edit'
+  context 'text files' do
+    it 'shows rendered output for SVG' do
+      visit_blob('files/images/wm.svg')
+
+      expect(page).to have_selector('.blob-viewer[data-type="rich"]')
+    end
+
+    it 'switches to code view' do
+      visit_blob('files/images/wm.svg')
+
+      first('.js-blob-viewer-switcher').click
+
+      expect(page).to have_selector('.blob-viewer[data-type="rich"]', visible: false)
+      expect(page).to have_selector('.blob-viewer[data-type="simple"]')
+    end
+
+    it 'opens raw mode when linking to a line in SVG file' do
+      visit_blob('files/images/wm.svg', 'L1')
+
+      expect(page).to have_selector('#LC1.hll')
+      expect(page).to have_selector('.blob-viewer[data-type="simple"]')
+    end
+
+    it 'opens raw mode when linking to a line in MD file' do
+      visit_blob('README.md', 'L1')
+
+      expect(page).to have_selector('#LC1.hll')
+      expect(page).to have_selector('.blob-viewer[data-type="simple"]')
     end
   end
+
+  context 'binary files' do
+    it 'does not show view toggle buttons in toolbar' do
+      visit_blob('Gemfile.zip')
+
+      expect(first('.file-actions .btn-group')).to have_selector('.btn', count: 1)
+      expect(first('.file-actions .btn-group .btn')[:title]).to eq('Download blob')
+    end
   end
 end

spec/javascripts/blob/viewer/index_spec.js

+/* eslint-disable no-new */
+import BlobViewer from '~/blob/viewer/index';
+
+describe('Blob viewer', () => {
+  preloadFixtures('blob/show.html.raw');
+
+  beforeEach(() => {
+    loadFixtures('blob/show.html.raw');
+    $('#modal-upload-blob').remove();
+
+    new BlobViewer();
+
+    spyOn($, 'ajax').and.callFake(() => {
+      const d = $.Deferred();
+
+      d.resolve({
+        html: '<div>testing</div>',
+      });
+
+      return d.promise();
+    });
+  });
+
+  afterEach(() => {
+    location.hash = '';
+  });
+
+  it('loads source file after switching views', (done) => {
+    document.querySelector('.js-blob-viewer-switcher[data-viewer="simple"]').click();
+
+    setTimeout(() => {
+      expect($.ajax).toHaveBeenCalled();
+      expect(
+        document.querySelector('.js-blob-viewer-switcher[data-viewer="simple"]')
+          .classList.contains('hidden'),
+      ).toBeFalsy();
+
+      done();
+    });
+  });
+
+  it('loads source file when line number is in hash', (done) => {
+    location.hash = '#L1';
+
+    new BlobViewer();
+
+    setTimeout(() => {
+      expect($.ajax).toHaveBeenCalled();
+      expect(
+        document.querySelector('.js-blob-viewer-switcher[data-viewer="simple"]')
+          .classList.contains('hidden'),
+      ).toBeFalsy();
+
+      done();
+    });
+  });
+
+  it('doesnt reload file if already loaded', (done) => {
+    const asyncClick = () => new Promise((resolve) => {
+      document.querySelector('.js-blob-viewer-switcher[data-viewer="simple"]').click();
+
+      setTimeout(resolve);
+    });
+
+    asyncClick()
+      .then(() => {
+        expect($.ajax).toHaveBeenCalled();
+        return asyncClick();
+      })
+      .then(() => {
+        expect($.ajax.calls.count()).toBe(1);
+        expect(
+          document.querySelector('.blob-viewer[data-type="simple"]').getAttribute('data-loaded'),
+        ).toBe('true');
+
+        done();
+      });
+  });
+
+  describe('copy blob button', () => {
+    it('disabled on load', () => {
+      expect(
+        document.querySelector('.js-copy-blob-source-btn').classList.contains('disabled'),
+      ).toBeTruthy();
+    });
+
+    it('has tooltip when disabled', () => {
+      expect(
+        document.querySelector('.js-copy-blob-source-btn').getAttribute('data-original-title'),
+      ).toBe('Switch to the source view to copy the source to the clipboard');
+    });
+
+    it('enables after switching to simple view', (done) => {
+      document.querySelector('.js-blob-viewer-switcher[data-viewer="simple"]').click();
+
+      setTimeout(() => {
+        expect($.ajax).toHaveBeenCalled();
+        expect(
+          document.querySelector('.js-copy-blob-source-btn').classList.contains('disabled'),
+        ).toBeFalsy();
+
+        done();
+      });
+    });
+
+    it('updates tooltip after switching to simple view', (done) => {
+      document.querySelector('.js-blob-viewer-switcher[data-viewer="simple"]').click();
+
+      setTimeout(() => {
+        expect($.ajax).toHaveBeenCalled();
+
+        expect(
+          document.querySelector('.js-copy-blob-source-btn').getAttribute('data-original-title'),
+        ).toBe('Copy to clipboard');
+
+        done();
+      });
+    });
+  });
+});

spec/javascripts/fixtures/blob.rb

+require 'spec_helper'
+
+describe Projects::BlobController, '(JavaScript fixtures)', type: :controller do
+  include JavaScriptFixturesHelpers
+
+  let(:admin) { create(:admin) }
+  let(:namespace) { create(:namespace, name: 'frontend-fixtures' )}
+  let(:project) { create(:project, :repository, namespace: namespace, path: 'branches-project') }
+
+  render_views
+
+  before(:all) do
+    clean_frontend_fixtures('blob/')
+  end
+
+  before(:each) do
+    sign_in(admin)
+  end
+
+  it 'blob/show.html.raw' do |example|
+    get(:show,
+        namespace_id: project.namespace,
+        project_id: project,
+        id: 'add-ipython-files/files/ipython/basic.ipynb')
+
+    expect(response).to be_success
+    store_frontend_fixture(response, example.description)
+  end
+end