summaryrefslogtreecommitdiff
path: root/spec/javascripts/blob
diff options
context:
space:
mode:
Diffstat (limited to 'spec/javascripts/blob')
-rw-r--r--spec/javascripts/blob/balsamiq/balsamiq_viewer_integration_spec.js51
-rw-r--r--spec/javascripts/blob/balsamiq/balsamiq_viewer_spec.js326
-rw-r--r--spec/javascripts/blob/blob_file_dropzone_spec.js42
-rw-r--r--spec/javascripts/blob/create_branch_dropdown_spec.js107
-rw-r--r--spec/javascripts/blob/pdf/index_spec.js6
-rw-r--r--spec/javascripts/blob/pdf/test.pdfbin11956 -> 0 bytes
-rw-r--r--spec/javascripts/blob/target_branch_dropdown_spec.js119
-rw-r--r--spec/javascripts/blob/viewer/index_spec.js184
8 files changed, 607 insertions, 228 deletions
diff --git a/spec/javascripts/blob/balsamiq/balsamiq_viewer_integration_spec.js b/spec/javascripts/blob/balsamiq/balsamiq_viewer_integration_spec.js
new file mode 100644
index 00000000000..acd0aaf2a86
--- /dev/null
+++ b/spec/javascripts/blob/balsamiq/balsamiq_viewer_integration_spec.js
@@ -0,0 +1,51 @@
+/* eslint-disable import/no-unresolved */
+
+import BalsamiqViewer from '~/blob/balsamiq/balsamiq_viewer';
+import bmprPath from '../../fixtures/blob/balsamiq/test.bmpr';
+
+describe('Balsamiq integration spec', () => {
+ let container;
+ let endpoint;
+ let balsamiqViewer;
+
+ preloadFixtures('static/balsamiq_viewer.html.raw');
+
+ beforeEach(() => {
+ loadFixtures('static/balsamiq_viewer.html.raw');
+
+ container = document.getElementById('js-balsamiq-viewer');
+ balsamiqViewer = new BalsamiqViewer(container);
+ });
+
+ describe('successful response', () => {
+ beforeEach((done) => {
+ endpoint = bmprPath;
+
+ balsamiqViewer.loadFile(endpoint).then(done).catch(done.fail);
+ });
+
+ it('does not show loading icon', () => {
+ expect(document.querySelector('.loading')).toBeNull();
+ });
+
+ it('renders the balsamiq previews', () => {
+ expect(document.querySelectorAll('.previews .preview').length).not.toEqual(0);
+ });
+ });
+
+ describe('error getting file', () => {
+ beforeEach((done) => {
+ endpoint = 'invalid/path/to/file.bmpr';
+
+ balsamiqViewer.loadFile(endpoint).then(done.fail, null).catch(done);
+ });
+
+ it('does not show loading icon', () => {
+ expect(document.querySelector('.loading')).toBeNull();
+ });
+
+ it('does not render the balsamiq previews', () => {
+ expect(document.querySelectorAll('.previews .preview').length).toEqual(0);
+ });
+ });
+});
diff --git a/spec/javascripts/blob/balsamiq/balsamiq_viewer_spec.js b/spec/javascripts/blob/balsamiq/balsamiq_viewer_spec.js
new file mode 100644
index 00000000000..aa87956109f
--- /dev/null
+++ b/spec/javascripts/blob/balsamiq/balsamiq_viewer_spec.js
@@ -0,0 +1,326 @@
+import sqljs from 'sql.js';
+import BalsamiqViewer from '~/blob/balsamiq/balsamiq_viewer';
+import ClassSpecHelper from '../../helpers/class_spec_helper';
+
+describe('BalsamiqViewer', () => {
+ let balsamiqViewer;
+ let viewer;
+
+ describe('class constructor', () => {
+ beforeEach(() => {
+ viewer = {};
+
+ balsamiqViewer = new BalsamiqViewer(viewer);
+ });
+
+ it('should set .viewer', () => {
+ expect(balsamiqViewer.viewer).toBe(viewer);
+ });
+ });
+
+ describe('fileLoaded', () => {
+
+ });
+
+ describe('loadFile', () => {
+ let xhr;
+ let loadFile;
+ const endpoint = 'endpoint';
+
+ beforeEach(() => {
+ xhr = jasmine.createSpyObj('xhr', ['open', 'send']);
+
+ balsamiqViewer = jasmine.createSpyObj('balsamiqViewer', ['renderFile']);
+
+ spyOn(window, 'XMLHttpRequest').and.returnValue(xhr);
+
+ loadFile = BalsamiqViewer.prototype.loadFile.call(balsamiqViewer, endpoint);
+ });
+
+ it('should call .open', () => {
+ expect(xhr.open).toHaveBeenCalledWith('GET', endpoint, true);
+ });
+
+ it('should set .responseType', () => {
+ expect(xhr.responseType).toBe('arraybuffer');
+ });
+
+ it('should call .send', () => {
+ expect(xhr.send).toHaveBeenCalled();
+ });
+
+ it('should return a promise', () => {
+ expect(loadFile).toEqual(jasmine.any(Promise));
+ });
+ });
+
+ describe('renderFile', () => {
+ let container;
+ let loadEvent;
+ let previews;
+
+ beforeEach(() => {
+ loadEvent = { target: { response: {} } };
+ viewer = jasmine.createSpyObj('viewer', ['appendChild']);
+ previews = [document.createElement('ul'), document.createElement('ul')];
+
+ balsamiqViewer = jasmine.createSpyObj('balsamiqViewer', ['initDatabase', 'getPreviews', 'renderPreview']);
+ balsamiqViewer.viewer = viewer;
+
+ balsamiqViewer.getPreviews.and.returnValue(previews);
+ balsamiqViewer.renderPreview.and.callFake(preview => preview);
+ viewer.appendChild.and.callFake((containerElement) => {
+ container = containerElement;
+ });
+
+ BalsamiqViewer.prototype.renderFile.call(balsamiqViewer, loadEvent);
+ });
+
+ it('should call .initDatabase', () => {
+ expect(balsamiqViewer.initDatabase).toHaveBeenCalledWith(loadEvent.target.response);
+ });
+
+ it('should call .getPreviews', () => {
+ expect(balsamiqViewer.getPreviews).toHaveBeenCalled();
+ });
+
+ it('should call .renderPreview for each preview', () => {
+ const allArgs = balsamiqViewer.renderPreview.calls.allArgs();
+
+ expect(allArgs.length).toBe(2);
+
+ previews.forEach((preview, i) => {
+ expect(allArgs[i][0]).toBe(preview);
+ });
+ });
+
+ it('should set the container HTML', () => {
+ expect(container.innerHTML).toBe('<ul></ul><ul></ul>');
+ });
+
+ it('should add inline preview classes', () => {
+ expect(container.classList[0]).toBe('list-inline');
+ expect(container.classList[1]).toBe('previews');
+ });
+
+ it('should call viewer.appendChild', () => {
+ expect(viewer.appendChild).toHaveBeenCalledWith(container);
+ });
+ });
+
+ describe('initDatabase', () => {
+ let database;
+ let uint8Array;
+ let data;
+
+ beforeEach(() => {
+ uint8Array = {};
+ database = {};
+ data = 'data';
+
+ balsamiqViewer = {};
+
+ spyOn(window, 'Uint8Array').and.returnValue(uint8Array);
+ spyOn(sqljs, 'Database').and.returnValue(database);
+
+ BalsamiqViewer.prototype.initDatabase.call(balsamiqViewer, data);
+ });
+
+ it('should instantiate Uint8Array', () => {
+ expect(window.Uint8Array).toHaveBeenCalledWith(data);
+ });
+
+ it('should call sqljs.Database', () => {
+ expect(sqljs.Database).toHaveBeenCalledWith(uint8Array);
+ });
+
+ it('should set .database', () => {
+ expect(balsamiqViewer.database).toBe(database);
+ });
+ });
+
+ describe('getPreviews', () => {
+ let database;
+ let thumbnails;
+ let getPreviews;
+
+ beforeEach(() => {
+ database = jasmine.createSpyObj('database', ['exec']);
+ thumbnails = [{ values: [0, 1, 2] }];
+
+ balsamiqViewer = {
+ database,
+ };
+
+ spyOn(BalsamiqViewer, 'parsePreview').and.callFake(preview => preview.toString());
+ database.exec.and.returnValue(thumbnails);
+
+ getPreviews = BalsamiqViewer.prototype.getPreviews.call(balsamiqViewer);
+ });
+
+ it('should call database.exec', () => {
+ expect(database.exec).toHaveBeenCalledWith('SELECT * FROM thumbnails');
+ });
+
+ it('should call .parsePreview for each value', () => {
+ const allArgs = BalsamiqViewer.parsePreview.calls.allArgs();
+
+ expect(allArgs.length).toBe(3);
+
+ thumbnails[0].values.forEach((value, i) => {
+ expect(allArgs[i][0]).toBe(value);
+ });
+ });
+
+ it('should return an array of parsed values', () => {
+ expect(getPreviews).toEqual(['0', '1', '2']);
+ });
+ });
+
+ describe('getResource', () => {
+ let database;
+ let resourceID;
+ let resource;
+ let getResource;
+
+ beforeEach(() => {
+ database = jasmine.createSpyObj('database', ['exec']);
+ resourceID = 4;
+ resource = ['resource'];
+
+ balsamiqViewer = {
+ database,
+ };
+
+ database.exec.and.returnValue(resource);
+
+ getResource = BalsamiqViewer.prototype.getResource.call(balsamiqViewer, resourceID);
+ });
+
+ it('should call database.exec', () => {
+ expect(database.exec).toHaveBeenCalledWith(`SELECT * FROM resources WHERE id = '${resourceID}'`);
+ });
+
+ it('should return the selected resource', () => {
+ expect(getResource).toBe(resource[0]);
+ });
+ });
+
+ describe('renderPreview', () => {
+ let previewElement;
+ let innerHTML;
+ let preview;
+ let renderPreview;
+
+ beforeEach(() => {
+ innerHTML = '<a>innerHTML</a>';
+ previewElement = {
+ outerHTML: '<p>outerHTML</p>',
+ classList: jasmine.createSpyObj('classList', ['add']),
+ };
+ preview = {};
+
+ balsamiqViewer = jasmine.createSpyObj('balsamiqViewer', ['renderTemplate']);
+
+ spyOn(document, 'createElement').and.returnValue(previewElement);
+ balsamiqViewer.renderTemplate.and.returnValue(innerHTML);
+
+ renderPreview = BalsamiqViewer.prototype.renderPreview.call(balsamiqViewer, preview);
+ });
+
+ it('should call classList.add', () => {
+ expect(previewElement.classList.add).toHaveBeenCalledWith('preview');
+ });
+
+ it('should call .renderTemplate', () => {
+ expect(balsamiqViewer.renderTemplate).toHaveBeenCalledWith(preview);
+ });
+
+ it('should set .innerHTML', () => {
+ expect(previewElement.innerHTML).toBe(innerHTML);
+ });
+
+ it('should return element', () => {
+ expect(renderPreview).toBe(previewElement);
+ });
+ });
+
+ describe('renderTemplate', () => {
+ let preview;
+ let name;
+ let resource;
+ let template;
+ let renderTemplate;
+
+ beforeEach(() => {
+ preview = { resourceID: 1, image: 'image' };
+ name = 'name';
+ resource = 'resource';
+ template = `
+ <div class="panel panel-default">
+ <div class="panel-heading">name</div>
+ <div class="panel-body">
+ <img class="img-thumbnail" src="data:image/png;base64,image"/>
+ </div>
+ </div>
+ `;
+
+ balsamiqViewer = jasmine.createSpyObj('balsamiqViewer', ['getResource']);
+
+ spyOn(BalsamiqViewer, 'parseTitle').and.returnValue(name);
+ balsamiqViewer.getResource.and.returnValue(resource);
+
+ renderTemplate = BalsamiqViewer.prototype.renderTemplate.call(balsamiqViewer, preview);
+ });
+
+ it('should call .getResource', () => {
+ expect(balsamiqViewer.getResource).toHaveBeenCalledWith(preview.resourceID);
+ });
+
+ it('should call .parseTitle', () => {
+ expect(BalsamiqViewer.parseTitle).toHaveBeenCalledWith(resource);
+ });
+
+ it('should return the template string', function () {
+ expect(renderTemplate.replace(/\s/g, '')).toEqual(template.replace(/\s/g, ''));
+ });
+ });
+
+ describe('parsePreview', () => {
+ let preview;
+ let parsePreview;
+
+ beforeEach(() => {
+ preview = ['{}', '{ "id": 1 }'];
+
+ spyOn(JSON, 'parse').and.callThrough();
+
+ parsePreview = BalsamiqViewer.parsePreview(preview);
+ });
+
+ ClassSpecHelper.itShouldBeAStaticMethod(BalsamiqViewer, 'parsePreview');
+
+ it('should return the parsed JSON', () => {
+ expect(parsePreview).toEqual(JSON.parse('{ "id": 1 }'));
+ });
+ });
+
+ describe('parseTitle', () => {
+ let title;
+ let parseTitle;
+
+ beforeEach(() => {
+ title = { values: [['{}', '{}', '{"name":"name"}']] };
+
+ spyOn(JSON, 'parse').and.callThrough();
+
+ parseTitle = BalsamiqViewer.parseTitle(title);
+ });
+
+ ClassSpecHelper.itShouldBeAStaticMethod(BalsamiqViewer, 'parsePreview');
+
+ it('should return the name value', () => {
+ expect(parseTitle).toBe('name');
+ });
+ });
+});
diff --git a/spec/javascripts/blob/blob_file_dropzone_spec.js b/spec/javascripts/blob/blob_file_dropzone_spec.js
new file mode 100644
index 00000000000..2c8183ff77b
--- /dev/null
+++ b/spec/javascripts/blob/blob_file_dropzone_spec.js
@@ -0,0 +1,42 @@
+import 'dropzone';
+import BlobFileDropzone from '~/blob/blob_file_dropzone';
+
+describe('BlobFileDropzone', () => {
+ preloadFixtures('blob/show.html.raw');
+
+ beforeEach(() => {
+ loadFixtures('blob/show.html.raw');
+ const form = $('.js-upload-blob-form');
+ this.blobFileDropzone = new BlobFileDropzone(form, 'POST');
+ this.dropzone = $('.js-upload-blob-form .dropzone').get(0).dropzone;
+ this.replaceFileButton = $('#submit-all');
+ });
+
+ describe('submit button', () => {
+ it('requires file', () => {
+ spyOn(window, 'alert');
+
+ this.replaceFileButton.click();
+
+ expect(window.alert).toHaveBeenCalled();
+ });
+
+ it('is disabled while uploading', () => {
+ spyOn(window, 'alert');
+
+ const file = {
+ name: 'some-file.jpg',
+ type: 'jpg',
+ };
+ const fakeEvent = jQuery.Event('drop', {
+ dataTransfer: { files: [file] },
+ });
+
+ this.dropzone.listeners[0].events.drop(fakeEvent);
+ this.replaceFileButton.click();
+
+ expect(window.alert).not.toHaveBeenCalled();
+ expect(this.replaceFileButton.is(':disabled')).toEqual(true);
+ });
+ });
+});
diff --git a/spec/javascripts/blob/create_branch_dropdown_spec.js b/spec/javascripts/blob/create_branch_dropdown_spec.js
deleted file mode 100644
index c1179e572ae..00000000000
--- a/spec/javascripts/blob/create_branch_dropdown_spec.js
+++ /dev/null
@@ -1,107 +0,0 @@
-require('~/gl_dropdown');
-require('~/lib/utils/type_utility');
-require('~/blob/create_branch_dropdown');
-require('~/blob/target_branch_dropdown');
-
-describe('CreateBranchDropdown', () => {
- const fixtureTemplate = 'static/target_branch_dropdown.html.raw';
- // selectors
- const createBranchSel = '.js-new-branch-btn';
- const backBtnSel = '.dropdown-menu-back';
- const cancelBtnSel = '.js-cancel-branch-btn';
- const branchNameSel = '#new_branch_name';
- const branchName = 'new_name';
- let dropdown;
-
- function createDropdown() {
- const dropdownEl = document.querySelector('.js-project-branches-dropdown');
- const projectBranches = getJSONFixture('project_branches.json');
- dropdown = new gl.TargetBranchDropDown(dropdownEl);
- dropdown.cachedRefs = projectBranches;
- return dropdown;
- }
-
- function createBranchBtn() {
- return document.querySelector(createBranchSel);
- }
-
- function backBtn() {
- return document.querySelector(backBtnSel);
- }
-
- function cancelBtn() {
- return document.querySelector(cancelBtnSel);
- }
-
- function branchNameEl() {
- return document.querySelector(branchNameSel);
- }
-
- function changeBranchName(text) {
- branchNameEl().value = text;
- branchNameEl().dispatchEvent(new Event('change'));
- }
-
- preloadFixtures(fixtureTemplate);
-
- beforeEach(() => {
- loadFixtures(fixtureTemplate);
- createDropdown();
- });
-
- it('disable submit when branch name is empty', () => {
- expect(createBranchBtn()).toBeDisabled();
- });
-
- it('enable submit when branch name is present', () => {
- changeBranchName(branchName);
-
- expect(createBranchBtn()).not.toBeDisabled();
- });
-
- it('resets the form when cancel btn is clicked and triggers dropdownback', () => {
- const spyBackEvent = spyOnEvent(backBtnSel, 'click');
- changeBranchName(branchName);
-
- cancelBtn().click();
-
- expect(branchNameEl()).toHaveValue('');
- expect(spyBackEvent).toHaveBeenTriggered();
- });
-
- it('resets the form when back btn is clicked', () => {
- changeBranchName(branchName);
-
- backBtn().click();
-
- expect(branchNameEl()).toHaveValue('');
- });
-
- describe('new branch creation', () => {
- beforeEach(() => {
- changeBranchName(branchName);
- });
- it('sets the new branch name and updates the dropdown', () => {
- spyOn(dropdown, 'setNewBranch');
-
- createBranchBtn().click();
-
- expect(dropdown.setNewBranch).toHaveBeenCalledWith(branchName);
- });
-
- it('resets the form', () => {
- createBranchBtn().click();
-
- expect(branchNameEl()).toHaveValue('');
- });
-
- it('is triggered with enter keypress', () => {
- spyOn(dropdown, 'setNewBranch');
- const enterEvent = new Event('keydown');
- enterEvent.which = 13;
- branchNameEl().dispatchEvent(enterEvent);
-
- expect(dropdown.setNewBranch).toHaveBeenCalledWith(branchName);
- });
- });
-});
diff --git a/spec/javascripts/blob/pdf/index_spec.js b/spec/javascripts/blob/pdf/index_spec.js
index d3a4d04345b..bbeaf95e68d 100644
--- a/spec/javascripts/blob/pdf/index_spec.js
+++ b/spec/javascripts/blob/pdf/index_spec.js
@@ -1,5 +1,7 @@
+/* eslint-disable import/no-unresolved */
+
import renderPDF from '~/blob/pdf';
-import testPDF from './test.pdf';
+import testPDF from '../../fixtures/blob/pdf/test.pdf';
describe('PDF renderer', () => {
let viewer;
@@ -59,7 +61,7 @@ describe('PDF renderer', () => {
describe('error getting file', () => {
beforeEach((done) => {
- viewer.dataset.endpoint = 'invalid/endpoint';
+ viewer.dataset.endpoint = 'invalid/path/to/file.pdf';
app = renderPDF();
checkLoaded(done);
diff --git a/spec/javascripts/blob/pdf/test.pdf b/spec/javascripts/blob/pdf/test.pdf
deleted file mode 100644
index eb3d147fde3..00000000000
--- a/spec/javascripts/blob/pdf/test.pdf
+++ /dev/null
Binary files differ
diff --git a/spec/javascripts/blob/target_branch_dropdown_spec.js b/spec/javascripts/blob/target_branch_dropdown_spec.js
deleted file mode 100644
index 4fb79663c51..00000000000
--- a/spec/javascripts/blob/target_branch_dropdown_spec.js
+++ /dev/null
@@ -1,119 +0,0 @@
-require('~/gl_dropdown');
-require('~/lib/utils/type_utility');
-require('~/blob/create_branch_dropdown');
-require('~/blob/target_branch_dropdown');
-
-describe('TargetBranchDropdown', () => {
- const fixtureTemplate = 'static/target_branch_dropdown.html.raw';
- let dropdown;
-
- function createDropdown() {
- const projectBranches = getJSONFixture('project_branches.json');
- const dropdownEl = document.querySelector('.js-project-branches-dropdown');
- dropdown = new gl.TargetBranchDropDown(dropdownEl);
- dropdown.cachedRefs = projectBranches;
- dropdown.refreshData();
- return dropdown;
- }
-
- function submitBtn() {
- return document.querySelector('button[type="submit"]');
- }
-
- function searchField() {
- return document.querySelector('.dropdown-page-one .dropdown-input-field');
- }
-
- function element() {
- return document.querySelectorAll('div.dropdown-content li a');
- }
-
- function elementAtIndex(index) {
- return element()[index];
- }
-
- function clickElementAtIndex(index) {
- elementAtIndex(index).click();
- }
-
- preloadFixtures(fixtureTemplate);
-
- beforeEach(() => {
- loadFixtures(fixtureTemplate);
- createDropdown();
- });
-
- it('disable submit when branch is not selected', () => {
- document.querySelector('input[name="target_branch"]').value = null;
- clickElementAtIndex(1);
-
- expect(submitBtn().getAttribute('disabled')).toEqual('');
- });
-
- it('enable submit when a branch is selected', () => {
- clickElementAtIndex(1);
-
- expect(submitBtn().getAttribute('disabled')).toBe(null);
- });
-
- it('triggers change.branch event on a branch click', () => {
- spyOnEvent(dropdown.$dropdown, 'change.branch');
- clickElementAtIndex(0);
-
- expect('change.branch').toHaveBeenTriggeredOn(dropdown.$dropdown);
- });
-
- describe('#dropdownData', () => {
- it('cache the refs', () => {
- const refs = dropdown.cachedRefs;
- dropdown.cachedRefs = null;
-
- dropdown.dropdownData(refs);
-
- expect(dropdown.cachedRefs).toEqual(refs);
- });
-
- it('returns the Branches with the newBranch and defaultBranch', () => {
- const refs = dropdown.cachedRefs;
- dropdown.branchInput.value = 'master';
- dropdown.newBranch = { id: 'new_branch', text: 'new_branch', title: 'new_branch' };
-
- const branches = dropdown.dropdownData(refs).Branches;
-
- expect(branches.length).toEqual(4);
- expect(branches[0]).toEqual(dropdown.newBranch);
- expect(branches[1]).toEqual({ id: 'master', text: 'master', title: 'master' });
- expect(branches[2]).toEqual({ id: 'development', text: 'development', title: 'development' });
- expect(branches[3]).toEqual({ id: 'staging', text: 'staging', title: 'staging' });
- });
- });
-
- describe('#setNewBranch', () => {
- it('adds the new branch and select it', () => {
- const branchName = 'new_branch';
-
- dropdown.setNewBranch(branchName);
-
- expect(elementAtIndex(0)).toHaveClass('is-active');
- expect(elementAtIndex(0)).toContainHtml(branchName);
- });
-
- it("doesn't add a new branch if already exists in the list", () => {
- const branchName = elementAtIndex(0).text;
- const initialLength = element().length;
-
- dropdown.setNewBranch(branchName);
-
- expect(element().length).toEqual(initialLength);
- });
-
- it('clears the search filter', () => {
- const branchName = elementAtIndex(0).text;
- searchField().value = 'searching';
-
- dropdown.setNewBranch(branchName);
-
- expect(searchField().value).toEqual('');
- });
- });
-});
diff --git a/spec/javascripts/blob/viewer/index_spec.js b/spec/javascripts/blob/viewer/index_spec.js
new file mode 100644
index 00000000000..cfa6650d85f
--- /dev/null
+++ b/spec/javascripts/blob/viewer/index_spec.js
@@ -0,0 +1,184 @@
+/* eslint-disable no-new */
+import BlobViewer from '~/blob/viewer/index';
+
+describe('Blob viewer', () => {
+ let blob;
+ preloadFixtures('snippets/show.html.raw');
+
+ beforeEach(() => {
+ loadFixtures('snippets/show.html.raw');
+ $('#modal-upload-blob').remove();
+
+ blob = 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-switch-btn[data-viewer="simple"]').click();
+
+ setTimeout(() => {
+ expect($.ajax).toHaveBeenCalled();
+ expect(
+ document.querySelector('.js-blob-viewer-switch-btn[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-switch-btn[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-switch-btn[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();
+ })
+ .catch(() => {
+ fail();
+ done();
+ });
+ });
+
+ describe('copy blob button', () => {
+ let copyButton;
+
+ beforeEach(() => {
+ copyButton = document.querySelector('.js-copy-blob-source-btn');
+ });
+
+ it('disabled on load', () => {
+ expect(
+ copyButton.classList.contains('disabled'),
+ ).toBeTruthy();
+ });
+
+ it('has tooltip when disabled', () => {
+ expect(
+ copyButton.getAttribute('data-original-title'),
+ ).toBe('Switch to the source to copy it to the clipboard');
+ });
+
+ it('is blurred when clicked and disabled', () => {
+ spyOn(copyButton, 'blur');
+
+ copyButton.click();
+
+ expect(copyButton.blur).toHaveBeenCalled();
+ });
+
+ it('is not blurred when clicked and not disabled', () => {
+ spyOn(copyButton, 'blur');
+
+ copyButton.classList.remove('disabled');
+ copyButton.click();
+
+ expect(copyButton.blur).not.toHaveBeenCalled();
+ });
+
+ it('enables after switching to simple view', (done) => {
+ document.querySelector('.js-blob-viewer-switch-btn[data-viewer="simple"]').click();
+
+ setTimeout(() => {
+ expect($.ajax).toHaveBeenCalled();
+ expect(
+ copyButton.classList.contains('disabled'),
+ ).toBeFalsy();
+
+ done();
+ });
+ });
+
+ it('updates tooltip after switching to simple view', (done) => {
+ document.querySelector('.js-blob-viewer-switch-btn[data-viewer="simple"]').click();
+
+ setTimeout(() => {
+ expect($.ajax).toHaveBeenCalled();
+
+ expect(
+ copyButton.getAttribute('data-original-title'),
+ ).toBe('Copy source to clipboard');
+
+ done();
+ });
+ });
+ });
+
+ describe('switchToViewer', () => {
+ it('removes active class from old viewer button', () => {
+ blob.switchToViewer('simple');
+
+ expect(
+ document.querySelector('.js-blob-viewer-switch-btn.active[data-viewer="rich"]'),
+ ).toBeNull();
+ });
+
+ it('adds active class to new viewer button', () => {
+ const simpleBtn = document.querySelector('.js-blob-viewer-switch-btn[data-viewer="simple"]');
+
+ spyOn(simpleBtn, 'blur');
+
+ blob.switchToViewer('simple');
+
+ expect(
+ simpleBtn.classList.contains('active'),
+ ).toBeTruthy();
+ expect(simpleBtn.blur).toHaveBeenCalled();
+ });
+
+ it('sends AJAX request when switching to simple view', () => {
+ blob.switchToViewer('simple');
+
+ expect($.ajax).toHaveBeenCalled();
+ });
+
+ it('does not send AJAX request when switching to rich view', () => {
+ blob.switchToViewer('simple');
+ blob.switchToViewer('rich');
+
+ expect($.ajax.calls.count()).toBe(1);
+ });
+ });
+});
View Lorry Controller Status