diff --git a/package.json b/package.json index 8dba898..9a6d3d9 100644 --- a/package.json +++ b/package.json @@ -63,7 +63,7 @@ "build:dist": "rm -rf lib && webpack --config ./webpack.prod.js", "start": "webpack serve --config webpack.dev.js", "examples": "http-server ./ -p 3000 -o examples/index.html", - "debug": "karma start --timeout=28000 --browsers=Chrome --single-run=false", + "debug": "karma start --timeout=28000 --no-browsers --single-run=false", "test": "karma start", "release": "standard-version -a" } diff --git a/src/diff-view.js b/src/diff-view.js index ca09bce..c146ae3 100644 --- a/src/diff-view.js +++ b/src/diff-view.js @@ -3,7 +3,6 @@ require('codemirror/addon/selection/mark-selection.js'); const diff = require('./diff'); const DiffParser = require('./diff-parser'); -const LCS = require('./lcs'); const VDoc = require('./vdoc'); /** @@ -25,7 +24,7 @@ Removed `options.width` Removed `options.height` Removed `options.resized` Removed function `mergely.update` -Remove styles `.mergely-resizer`, `.mergely-full-screen-0`, and `.mergely-full-screen-8`. +Remove styles `.mergely-resizer`, `.mergely-full-screen-0`, and `.mergely-full-screen-8`. The mergely container now requires an explicit height. Child elements are added to it. Default for `options.change_timeout` changed to 50. No longer necessary to separately require codemirror/addon/search/searchcursor No longer necessary to separately require codemirror/addon/selection/mark-selection @@ -254,23 +253,20 @@ CodeMirrorDiffView.prototype._setOptions = function(opts) { ...this.settings, ...opts }; - if (this.settings.hasOwnProperty('sidebar')) { - // dynamically enable sidebars - if (this.settings.sidebar) { - const divs = document.querySelectorAll(`#${this.id} .mergely-margin`); - for (const div of divs) { - div.style.visibility = 'visible'; - } - } - else { - const divs = document.querySelectorAll(`#${this.id} .mergely-margin`); - for (const div of divs) { - div.style.visibility = 'hidden'; - } - } + if (this.settings._debug) { + trace('api#_setOptions', opts); } + // if options set after init if (this.editor) { + if (opts.hasOwnProperty('sidebar')) { + const divs = document.querySelectorAll(`#${this.id} .mergely-margin`); + const visible = !!opts.sidebar; + for (const div of divs) { + div.style.visibility = visible ? 'visible' : 'hidden'; + } + } + const le = this.editor.lhs; const re = this.editor.rhs; if (opts.hasOwnProperty('wrap_lines')) { @@ -502,11 +498,8 @@ CodeMirrorDiffView.prototype.bind = function(container) { el.append(canvasRhs); } if (!this.settings.sidebar) { - // it would be better if this just used this.options() - const divs = document.querySelectorAll(`#${this.id} .mergely-margin`); - for (const div of divs) { - div.style.visibility = 'hidden'; - } + canvasLhs.style.visibility = 'hidden'; + canvasRhs.style.visibility = 'hidden'; } container.append(el); diff --git a/test/mergely.spec.js b/test/mergely.spec.js index b6429db..70603ee 100644 --- a/test/mergely.spec.js +++ b/test/mergely.spec.js @@ -1,4 +1,3 @@ -const CodeMirror = require('CodeMirror'); const simple = require('simple-mock'); const Mergely = require('../src/mergely'); const macbeth = require('./data/macbeth').join('\n'); @@ -28,24 +27,24 @@ const defaultOptions = { describe('mergely', function () { let editor; + let editorId = 0; function init(options) { - editor = new window.Mergely('#mergely', options); + editor = new window.Mergely(`#mergely-${editorId - 1}`, options); return editor; }; - before(() => { - const container = document.createElement('div'); - container.style.height = '275px'; + beforeEach(() => { const div = document.createElement('div'); - div.id = 'mergely'; + div.id = `mergely-${editorId++}`; div.style.margin = '0px'; - container.append(div); - document.querySelector('body').appendChild(container); + div.style.height = '275px'; + document.querySelector('body').appendChild(div); }); afterEach(() => { editor && editor.unbind(); simple.restore(); + editor.el.parentNode.removeChild(editor.el); }); describe('initialization', () => { @@ -53,7 +52,7 @@ describe('mergely', function () { const editor = init(); expect(editor).to.exist; editor.once('updated', () => { - const { children } = editor.el; + const { children } = editor.el.children[0]; const items = Array.from(children).map(a => a.className); // NOTE: if running karma debug, these tests can fail because // the debugger grabs the focus and the CodeMirror instance @@ -82,7 +81,7 @@ describe('mergely', function () { }); expect(editor).to.exist; editor.once('updated', () => { - const { children } = editor.el; + const { children } = editor.el.children[0]; const items = Array.from(children).map(a => a.className); // NOTE: if running karma debug, these tests can fail because // the debugger grabs the focus and the CodeMirror instance @@ -110,7 +109,7 @@ describe('mergely', function () { }); expect(editor).to.exist; editor.once('updated', () => { - const { children } = editor.el; + const { children } = editor.el.children[0]; const items = Array.from(children).map(a => a.className); // NOTE: if running karma debug, these tests can fail because // the debugger grabs the focus and the CodeMirror instance @@ -160,8 +159,8 @@ describe('mergely', function () { }); }); - it.only('initializes with and set lhs/rhs on update', function (done) { - const editor = init({ _debug: true }); + it('initializes with and set lhs/rhs on update', function (done) { + const editor = init(); expect(editor).to.exist; const test = () => { done(); diff --git a/webpack.prod.js b/webpack.prod.js index 373d41d..27d98f5 100644 --- a/webpack.prod.js +++ b/webpack.prod.js @@ -1,9 +1,6 @@ -const webpack = require('webpack'); const path = require('path'); const CopyWebpackPlugin = require('copy-webpack-plugin'); -// const dev = require('./webpack.dev'); - const dev = { mode: 'development', entry: {