| <!DOCTYPE html> |
| <!-- |
| Copyright (C) 2015 The Android Open Source Project |
| |
| Licensed under the Apache License, Version 2.0 (the "License"); |
| you may not use this file except in compliance with the License. |
| You may obtain a copy of the License at |
| |
| http://www.apache.org/licenses/LICENSE-2.0 |
| |
| Unless required by applicable law or agreed to in writing, software |
| distributed under the License is distributed on an "AS IS" BASIS, |
| WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| See the License for the specific language governing permissions and |
| limitations under the License. |
| --> |
| |
| <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes"> |
| <title>gr-diff</title> |
| |
| <script src="../../../bower_components/webcomponentsjs/webcomponents.min.js"></script> |
| <script src="../../../bower_components/web-component-tester/browser.js"></script> |
| <script src="../../../test/fake-app.js"></script> |
| <script src="../../../scripts/util.js"></script> |
| |
| <link rel="import" href="../../../bower_components/iron-test-helpers/iron-test-helpers.html"> |
| <link rel="import" href="gr-diff.html"> |
| |
| <test-fixture id="basic"> |
| <template> |
| <gr-diff></gr-diff> |
| </template> |
| </test-fixture> |
| |
| <script> |
| suite('gr-diff tests', function() { |
| var element; |
| var server; |
| var getDiffStub; |
| var getCommentsStub; |
| |
| setup(function() { |
| element = fixture('basic'); |
| element.changeNum = 42; |
| element.path = 'sieve.go'; |
| element.prefs = { |
| context: 10, |
| tab_size: 8, |
| }; |
| |
| getDiffStub = sinon.stub(element.$.restAPI, 'getDiff', function() { |
| return Promise.resolve({ |
| change_type: 'MODIFIED', |
| content: [ |
| { |
| ab: [ |
| '<!DOCTYPE html>', |
| '<meta charset="utf-8">', |
| '<title>My great page</title>', |
| '<style>', |
| ' *,', |
| ' *:before,', |
| ' *:after {', |
| ' box-sizing: border-box;', |
| ' }', |
| '</style>', |
| '<header>', |
| ] |
| }, |
| { |
| a: [ |
| ' Welcome ', |
| ' to the wooorld of tomorrow!', |
| ], |
| b: [ |
| ' Hello, world!', |
| ], |
| }, |
| { |
| ab: [ |
| '</header>', |
| '<body>', |
| 'Leela: This is the only place the ship can’t hear us, so ', |
| 'everyone pretend to shower.', |
| 'Fry: Same as every day. Got it.', |
| ] |
| }, |
| ] |
| }); |
| }); |
| |
| getCommentsStub = sinon.stub(element.$.restAPI, 'getDiffComments', |
| function() { |
| return Promise.resolve({ |
| baseComments: [ |
| { |
| author: { |
| _account_id: 1000000, |
| name: 'Andrew Bonventre', |
| email: 'andybons@gmail.com', |
| }, |
| id: '9af53d3f_5f2b8b82', |
| line: 1, |
| message: 'this isn’t quite right', |
| updated: '2015-12-10 02:50:21.627000000', |
| } |
| ], |
| comments: [ |
| { |
| author: { |
| _account_id: 1010008, |
| name: 'Dave Borowitz', |
| email: 'dborowitz@google.com', |
| }, |
| id: '001a2067_f30f3048', |
| line: 12, |
| message: 'What on earth are you thinking, here?', |
| updated: '2015-12-12 02:51:37.973000000', |
| }, |
| { |
| author: { |
| _account_id: 1000000, |
| name: 'Andrew Bonventre', |
| email: 'andybons@gmail.com', |
| }, |
| id: 'a0407443_30dfe8fb', |
| in_reply_to: '001a2067_f30f3048', |
| line: 12, |
| message: '¯\\_(ツ)_/¯', |
| updated: '2015-12-12 18:50:21.627000000', |
| }, |
| ], |
| }); |
| } |
| ); |
| |
| server = sinon.fakeServer.create(); |
| server.respondWith( |
| 'PUT', |
| '/accounts/self/preferences.diff', |
| [ |
| 200, |
| {'Content-Type': 'application/json'}, |
| ')]}\'\n' + |
| JSON.stringify({context: 25}), |
| ] |
| ); |
| |
| }); |
| |
| teardown(function() { |
| getDiffStub.restore(); |
| getCommentsStub.restore(); |
| server.restore(); |
| }); |
| |
| test('comment rendering', function(done) { |
| element.prefs.context = -1; |
| element._loggedIn = true; |
| element.patchRange = { |
| basePatchNum: 1, |
| patchNum: 2, |
| }; |
| |
| element.reload().then(function() { |
| flush(function() { |
| var leftThreadEls = |
| Polymer.dom(element.$.leftDiff.root).querySelectorAll( |
| 'gr-diff-comment-thread'); |
| assert.equal(leftThreadEls.length, 1); |
| assert.equal(leftThreadEls[0].comments.length, 1); |
| |
| var rightThreadEls = |
| Polymer.dom(element.$.rightDiff.root).querySelectorAll( |
| 'gr-diff-comment-thread'); |
| assert.equal(rightThreadEls.length, 1); |
| assert.equal(rightThreadEls[0].comments.length, 2); |
| |
| var index = leftThreadEls[0].getAttribute('data-index'); |
| var leftFillerEls = |
| Polymer.dom(element.$.leftDiff.root).querySelectorAll( |
| '.commentThread.filler[data-index="' + index + '"]'); |
| assert.equal(leftFillerEls.length, 1); |
| var rightFillerEls = |
| Polymer.dom(element.$.rightDiff.root).querySelectorAll( |
| '[data-index="' + index + '"]'); |
| assert.equal(rightFillerEls.length, 2); |
| |
| for (var i = 0; i < rightFillerEls.length; i++) { |
| assert.isTrue(rightFillerEls[i].classList.contains('filler')); |
| } |
| var originalHeight = rightFillerEls[0].offsetHeight; |
| assert.equal(rightFillerEls[1].offsetHeight, originalHeight); |
| assert.equal(leftThreadEls[0].offsetHeight, originalHeight); |
| assert.equal(leftFillerEls[0].offsetHeight, originalHeight); |
| |
| // Create a comment on the opposite side of the first comment. |
| var rightLineEL = element.$.rightDiff.$$( |
| '.lineNum[data-index="' + (index - 1) + '"]'); |
| assert.ok(rightLineEL); |
| MockInteractions.tap(rightLineEL); |
| flush(function() { |
| var newThreadEls = |
| Polymer.dom(element.$.rightDiff.root).querySelectorAll( |
| '[data-index="' + index + '"]'); |
| assert.equal(newThreadEls.length, 2); |
| for (var i = 0; i < newThreadEls.length; i++) { |
| assert.isTrue( |
| newThreadEls[i].classList.contains('commentThread') || |
| newThreadEls[i].tagName == 'GR-DIFF-COMMENT-THREAD'); |
| } |
| var newHeight = newThreadEls[0].offsetHeight; |
| assert.equal(newThreadEls[1].offsetHeight, newHeight); |
| assert.equal(leftFillerEls[0].offsetHeight, newHeight); |
| assert.equal(leftThreadEls[0].offsetHeight, newHeight); |
| |
| // The editing mode height of the right comment will be greater than |
| // the non-editing mode height of the left comment. |
| assert.isAbove(newHeight, originalHeight); |
| |
| // Discard the right thread and ensure the left comment heights are |
| // back to their original values. |
| newThreadEls[1].addEventListener('discard', function() { |
| rightFillerEls = |
| Polymer.dom(element.$.rightDiff.root).querySelectorAll( |
| '[data-index="' + index + '"]'); |
| assert.equal(rightFillerEls.length, 2); |
| |
| for (var i = 0; i < rightFillerEls.length; i++) { |
| assert.isTrue(rightFillerEls[i].classList.contains('filler')); |
| } |
| var originalHeight = rightFillerEls[0].offsetHeight; |
| assert.equal(rightFillerEls[1].offsetHeight, originalHeight); |
| assert.equal(leftThreadEls[0].offsetHeight, originalHeight); |
| assert.equal(leftFillerEls[0].offsetHeight, originalHeight); |
| done(); |
| }); |
| var commentEl = newThreadEls[1].$$('gr-diff-comment'); |
| commentEl.fire('discard', null, {bubbles: false}); |
| }); |
| }); |
| }); |
| server.respond(); |
| }); |
| |
| test('intraline normalization', function() { |
| // The content and highlights are in the format returned by the Gerrit |
| // REST API. |
| var content = [ |
| ' <section class="summary">', |
| ' <gr-linked-text content="' + |
| '[[_computeCurrentRevisionMessage(change)]]"></gr-linked-text>', |
| ' </section>', |
| ]; |
| var highlights = [ |
| [31, 34], [42, 26] |
| ]; |
| var results = element._normalizeIntralineHighlights(content, highlights); |
| assert.deepEqual(results, [ |
| { |
| contentIndex: 0, |
| startIndex: 31, |
| }, |
| { |
| contentIndex: 1, |
| startIndex: 0, |
| endIndex: 33, |
| }, |
| { |
| contentIndex: 1, |
| startIndex: 75, |
| }, |
| { |
| contentIndex: 2, |
| startIndex: 0, |
| endIndex: 6, |
| } |
| ]); |
| |
| content = [ |
| ' this._path = value.path;', |
| '', |
| ' // When navigating away from the page, there is a possibility that the', |
| ' // patch number is no longer a part of the URL (say when navigating to', |
| ' // the top-level change info view) and therefore undefined in `params`.', |
| ' if (!this._patchRange.patchNum) {', |
| ]; |
| highlights = [ |
| [14, 17], |
| [11, 70], |
| [12, 67], |
| [12, 67], |
| [14, 29], |
| ]; |
| results = element._normalizeIntralineHighlights(content, highlights); |
| assert.deepEqual(results, [ |
| { |
| contentIndex: 0, |
| startIndex: 14, |
| endIndex: 31, |
| }, |
| { |
| contentIndex: 2, |
| startIndex: 8, |
| endIndex: 78, |
| }, |
| { |
| contentIndex: 3, |
| startIndex: 11, |
| endIndex: 78, |
| }, |
| { |
| contentIndex: 4, |
| startIndex: 11, |
| endIndex: 78, |
| }, |
| { |
| contentIndex: 5, |
| startIndex: 12, |
| endIndex: 41, |
| } |
| ]); |
| }); |
| |
| test('context', function() { |
| element.prefs.context = 3; |
| element._diffResponse = { |
| content: [ |
| { |
| ab: [ |
| '<!DOCTYPE html>', |
| '<meta charset="utf-8">', |
| '<title>My great page</title>', |
| '<style>', |
| ' *,', |
| ' *:before,', |
| ' *:after {', |
| ' box-sizing: border-box;', |
| ' }', |
| '</style>', |
| '<header>', |
| ] |
| }, |
| { |
| a: [ |
| ' Welcome ', |
| ' to the wooorld of tomorrow!', |
| ], |
| b: [ |
| ' Hello, world!', |
| ], |
| }, |
| { |
| ab: [ |
| '</header>', |
| '<body>', |
| 'Leela: This is the only place the ship can’t hear us, so ', |
| 'everyone pretend to shower.', |
| 'Fry: Same as every day. Got it.', |
| ] |
| }, |
| ] |
| }; |
| element._processContent(); |
| |
| // First eight lines should be hidden on both sides. |
| for (var i = 0; i < 8; i++) { |
| assert.isTrue(element._diff.leftSide[i].hidden); |
| assert.isTrue(element._diff.rightSide[i].hidden); |
| } |
| // A context control should be at index 8 on both sides. |
| var leftContext = element._diff.leftSide[8]; |
| var rightContext = element._diff.rightSide[8]; |
| assert.deepEqual(leftContext, rightContext); |
| assert.equal(leftContext.numLines, 8); |
| assert.equal(leftContext.start, 0); |
| assert.equal(leftContext.end, 8); |
| |
| // Line indices 9-16 should be shown. |
| for (var i = 9; i <= 16; i++) { |
| // notOk (falsy) because the `hidden` attribute may not be present. |
| assert.notOk(element._diff.leftSide[i].hidden); |
| assert.notOk(element._diff.rightSide[i].hidden); |
| } |
| |
| // Lines at indices 17 and 18 should be hidden. |
| assert.isTrue(element._diff.leftSide[17].hidden); |
| assert.isTrue(element._diff.rightSide[17].hidden); |
| assert.isTrue(element._diff.leftSide[18].hidden); |
| assert.isTrue(element._diff.rightSide[18].hidden); |
| |
| // Context control at index 19. |
| leftContext = element._diff.leftSide[19]; |
| rightContext = element._diff.rightSide[19]; |
| assert.deepEqual(leftContext, rightContext); |
| assert.equal(leftContext.numLines, 2); |
| assert.equal(leftContext.start, 17); |
| assert.equal(leftContext.end, 19); |
| }); |
| |
| test('save prefs', function(done) { |
| element._loggedIn = false; |
| |
| element.prefs = { |
| tab_size: 4, |
| context: 50, |
| }; |
| element.fire('save', {}, {node: element.$$('gr-diff-preferences')}); |
| assert.isTrue(element._diffPreferencesPromise == null); |
| |
| element._loggedIn = true; |
| element.fire('save', {}, {node: element.$$('gr-diff-preferences')}); |
| server.respond(); |
| |
| element._diffPreferencesPromise.then(function(req) { |
| assert.equal(req.xhr.requestBody, JSON.stringify(element.prefs)); |
| done(); |
| }); |
| }); |
| |
| test('visible line length', function() { |
| assert.equal(element._visibleLineLength('A'.repeat(5)), 5); |
| assert.equal( |
| element._visibleLineLength('A'.repeat(5) + '\t' + 'A'.repeat(5)), 18); |
| }); |
| |
| test('break up common diff chunks', function() { |
| element._groupedBaseComments = { |
| 1: {}, |
| }; |
| element._groupedComments = { |
| 10: {}, |
| }; |
| var ctx = { |
| left: {lineNum: 0}, |
| right: {lineNum: 0}, |
| }; |
| var content = [ |
| { |
| ab: [ |
| 'Copyright (C) 2015 The Android Open Source Project', |
| '', |
| 'Licensed under the Apache License, Version 2.0 (the "License");', |
| 'you may not use this file except in compliance with the License.', |
| 'You may obtain a copy of the License at', |
| '', |
| 'http://www.apache.org/licenses/LICENSE-2.0', |
| '', |
| 'Unless required by applicable law or agreed to in writing, ', |
| 'software distributed under the License is distributed on an ', |
| '"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, ', |
| 'either express or implied. See the License for the specific ', |
| 'language governing permissions and limitations under the License.', |
| ] |
| } |
| ]; |
| var result = element._breakUpCommonChunksWithComments(ctx, content); |
| assert.deepEqual(result, [ |
| { |
| __noHighlight: true, |
| a: ['Copyright (C) 2015 The Android Open Source Project'], |
| b: ['Copyright (C) 2015 The Android Open Source Project'], |
| }, |
| { |
| ab: [ |
| '', |
| 'Licensed under the Apache License, Version 2.0 (the "License");', |
| 'you may not use this file except in compliance with the License.', |
| 'You may obtain a copy of the License at', |
| '', |
| 'http://www.apache.org/licenses/LICENSE-2.0', |
| '', |
| 'Unless required by applicable law or agreed to in writing, ', |
| ] |
| }, |
| { |
| __noHighlight: true, |
| a: ['software distributed under the License is distributed on an '], |
| b: ['software distributed under the License is distributed on an '] |
| }, |
| { |
| ab: [ |
| '"AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, ', |
| 'either express or implied. See the License for the specific ', |
| 'language governing permissions and limitations under the License.', |
| ] |
| } |
| ]); |
| }); |
| }); |
| |
| </script> |
