From 3cdce44d68a545320bb8cae47f21c59aecb47878 Mon Sep 17 00:00:00 2001 From: lucky-bruce Date: Sun, 6 May 2018 18:09:49 +0500 Subject: [PATCH] Fixed https://github.com/xdan/jodit/issues/39 --- package.json | 4 +- src/modules/Helpers.ts | 16 ++- src/plugins/resizer.ts | 26 +++-- test/bootstrap.js | 1 + test/tests/enterTest.js | 8 +- test/tests/imageTest.js | 189 +++++++++++++++++++++-------------- test/tests/inlineModeTest.js | 8 +- test/tests/interfaceTest.js | 12 +-- test/tests/pluginsTest.js | 22 ++-- test/tests/tableTest.js | 2 +- 10 files changed, 179 insertions(+), 109 deletions(-) diff --git a/package.json b/package.json index 7deda237..35cad36f 100644 --- a/package.json +++ b/package.json @@ -31,7 +31,7 @@ "devDependencies": { "@types/ace": "^0.0.35", "@types/es6-promise": "^3.3.0", - "@types/node": "^7.0.61", + "@types/node": "^7.0.63", "autoprefixer": "^6.7.7", "awesome-typescript-loader": "^3.4.1", "chai": "^3.5.0", @@ -56,7 +56,7 @@ "less-loader": "^4.1.0", "mocha": "^3.4.2", "optimize-css-assets-webpack-plugin": "^3.2.0", - "postcss-loader": "^2.1.4", + "postcss-loader": "^2.1.5", "precss": "^2.0.0", "style-loader": "^0.13.2", "svg-inline-loader": "^0.8.0", diff --git a/src/modules/Helpers.ts b/src/modules/Helpers.ts index 13054d24..f6ef3358 100644 --- a/src/modules/Helpers.ts +++ b/src/modules/Helpers.ts @@ -354,7 +354,11 @@ export const dom = (html: string | HTMLElement, doc: Document): HTMLElement => { div.innerHTML = html; - return (div.firstChild !== div.lastChild || !div.firstChild) ? div : div.firstChild; + const child: HTMLElement = (div.firstChild !== div.lastChild || !div.firstChild) ? div : div.firstChild; + + child.parentNode && child.parentNode.removeChild(child); + + return child; }; /** @@ -1206,4 +1210,14 @@ export class JoditObject { export const getRange = () => { var range = window.getSelection().getRangeAt(0); return [range.startContainer, range.startOffset, range.endContainer, range.endOffset]; +}; + +export const innerWidth = (element: HTMLElement, win: Window): number => { + const computedStyle: CSSStyleDeclaration = win.getComputedStyle(element); + + let elementWidth: number = element.clientWidth; // width with padding + + elementWidth -= parseFloat(computedStyle.paddingLeft || '0') + parseFloat(computedStyle.paddingRight || '0'); + + return elementWidth; }; \ No newline at end of file diff --git a/src/plugins/resizer.ts b/src/plugins/resizer.ts index d9a3515e..1dc173f7 100644 --- a/src/plugins/resizer.ts +++ b/src/plugins/resizer.ts @@ -7,7 +7,7 @@ import {Jodit} from '../Jodit'; import {Config} from '../Config' import * as consts from '../constants' -import {$$, css, debounce, dom, isIE, offset} from '../modules/Helpers' +import {$$, css, debounce, dom, innerWidth, isIE, offset} from '../modules/Helpers' /** * The module creates a supporting frame for resizing of the elements img and table @@ -106,8 +106,10 @@ export function resizer(editor: Jodit) { if (!editor.options.resizer.showSize) { return; } + sizeViewer.style.opacity = '1'; sizeViewer.innerHTML = `${w} x ${h}`; + window.clearTimeout(timeoutSizeViewer); timeoutSizeViewer = window.setTimeout(() => { sizeViewer.style.opacity = '0'; @@ -147,6 +149,10 @@ export function resizer(editor: Jodit) { return; } + if (!resizer.parentNode) { + editor.ownerDocument.body.appendChild(resizer); + } + resizerIsVisible = true; resizer.style.display = 'block'; @@ -269,7 +275,6 @@ export function resizer(editor: Jodit) { } }) .on('afterInit', () => { - editor.ownerDocument.body.appendChild(resizer); editor.events .on(editor.editor, 'keydown', (e: KeyboardEvent) => { if (resizerIsVisible && e.keyCode === consts.KEY_DELETE && currentElement && currentElement.tagName.toLowerCase() !== 'table') { @@ -287,7 +292,6 @@ export function resizer(editor: Jodit) { }) .on(editor.ownerWindow, 'mousemove touchmove', (e: MouseEvent) => { if (isResizing) { - // resized = true; diff_x = e.clientX - start_x; diff_y = e.clientY - start_y; @@ -295,17 +299,25 @@ export function resizer(editor: Jodit) { return; } + const className: string = handle.className; + if ('IMG' === currentElement.tagName) { if (diff_x) { - new_w = width + (handle.className.match(/left/) ? -1 : 1) * diff_x; + new_w = width + (className.match(/left/) ? -1 : 1) * diff_x; new_h = Math.round(new_w / ratio); } else { - new_h = height + (handle.className.match(/top/) ? -1 : 1) * diff_y; + new_h = height + (className.match(/top/) ? -1 : 1) * diff_y; new_w = Math.round(new_h * ratio); } + + if (new_w > innerWidth(editor.editor, editor.ownerWindow)) { + new_w = innerWidth(editor.editor, editor.ownerWindow); + new_h = Math.round(new_w / ratio); + } + } else { - new_w = width + (handle.className.match(/left/) ? -1 : 1) * diff_x; - new_h = height + (handle.className.match(/top/) ? -1 : 1) * diff_y; + new_w = width + (className.match(/left/) ? -1 : 1) * diff_x; + new_h = height + (className.match(/top/) ? -1 : 1) * diff_y; } if (new_w > editor.options.resizer.min_width) { diff --git a/test/bootstrap.js b/test/bootstrap.js index 371f9f0f..c99e22c0 100644 --- a/test/bootstrap.js +++ b/test/bootstrap.js @@ -141,6 +141,7 @@ if ((typeof window.chai !== 'undefined')) { break; case 'getLocalFileByUrl': switch (ajax.options.data.url) { + case location.protocol + '//' + location.host + '/test/tests/artio.jpg': case 'https://xdsoft.net/jodit/files/th.jpg': resolve({"success":true,"time":"2018-03-15 12:55:00","data":{"path":"","name":"th.jpg","source":"default","code":220}}); break; diff --git a/test/tests/enterTest.js b/test/tests/enterTest.js index e0369d90..3a465741 100644 --- a/test/tests/enterTest.js +++ b/test/tests/enterTest.js @@ -339,7 +339,7 @@ describe('Enter behavior Jodit Editor Tests', function() { describe('Backspace key', function () { it('Should remove that element', function () { var editor = new Jodit(appendTestArea()) - editor.setEditorValue('

test

'); + editor.setEditorValue('

test

'); var sel = editor.editorWindow.getSelection(), range = editor.editorDocument.createRange(); @@ -361,7 +361,7 @@ describe('Enter behavior Jodit Editor Tests', function() { describe('Delete key', function () { it('Should remove that element', function () { var editor = new Jodit(appendTestArea()) - editor.setEditorValue('

test

'); + editor.setEditorValue('

test

'); var sel = editor.editorWindow.getSelection(), range = editor.editorDocument.createRange(); @@ -1190,7 +1190,7 @@ describe('Enter behavior Jodit Editor Tests', function() { editor.setEditorValue('
    ' + '
  • 1
    • ' + '
  • 2
    • ' + - '
    • ' + + '
    • ' + '
'); editor.selection.setCursorBefore(editor.editor.firstChild.lastChild.firstChild); @@ -1202,7 +1202,7 @@ describe('Enter behavior Jodit Editor Tests', function() { '
  • 1
    • ' + '
  • 2
    • ' + '

    • ' + - '
  • split
    • ' + + '
  • split
    • ' + '').to.be.equal(sortAtrtibutes(editor.getEditorValue())); }); }); diff --git a/test/tests/imageTest.js b/test/tests/imageTest.js index e8433eb0..5a7e0297 100644 --- a/test/tests/imageTest.js +++ b/test/tests/imageTest.js @@ -4,7 +4,7 @@ describe('Test image', function() { it('should open image properties dialog', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -18,7 +18,7 @@ describe('Test image', function() { } }); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -31,7 +31,7 @@ describe('Test image', function() { it('should change image border radius', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -48,7 +48,7 @@ describe('Test image', function() { tab.querySelector('.border_radius').value = 100; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -56,7 +56,7 @@ describe('Test image', function() { it('should change image classlist', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -73,7 +73,7 @@ describe('Test image', function() { tab.querySelector('.classes').value = 'tavble '; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -81,7 +81,7 @@ describe('Test image', function() { it('should change image styles', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -98,7 +98,7 @@ describe('Test image', function() { tab.querySelector('.style').value = 'padding:20px;background-color: #ff0000;'; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -106,7 +106,7 @@ describe('Test image', function() { it('should change image id', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -123,7 +123,7 @@ describe('Test image', function() { tab.querySelector('.id').value = 'fast12'; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -132,7 +132,7 @@ describe('Test image', function() { it('should change image horizontal align', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -147,7 +147,7 @@ describe('Test image', function() { tab.querySelector('.align').value = 'left'; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -155,7 +155,7 @@ describe('Test image', function() { it('should change image horizontal align', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -170,7 +170,7 @@ describe('Test image', function() { tab.querySelector('.align').value = 'right'; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -178,7 +178,7 @@ describe('Test image', function() { it('should change image horizontal align', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -193,7 +193,7 @@ describe('Test image', function() { tab.querySelector('.align').value = 'center'; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -201,7 +201,7 @@ describe('Test image', function() { it('should clear some align', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -216,7 +216,7 @@ describe('Test image', function() { tab.querySelector('.align').value = ''; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -226,7 +226,7 @@ describe('Test image', function() { it('should change all margins', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -243,7 +243,7 @@ describe('Test image', function() { tab.querySelector('.marginTop').value = 100; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -251,7 +251,7 @@ describe('Test image', function() { it('should change only marginTop', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -277,7 +277,7 @@ describe('Test image', function() { tab.querySelector('.marginLeft').value = 220; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -286,7 +286,7 @@ describe('Test image', function() { it('should change image title', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -299,7 +299,7 @@ describe('Test image', function() { dialog.querySelector('.imageTitle').value = 'Stop'; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -307,7 +307,7 @@ describe('Test image', function() { it('should change image alt', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('test') + editor.setEditorValue('test') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -320,7 +320,7 @@ describe('Test image', function() { dialog.querySelector('.imageAlt').value = 'Stop'; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal('Stop'); + expect(sortAtrtibutes(editor.value)).to.be.equal('Stop'); }); }); @@ -328,7 +328,7 @@ describe('Test image', function() { it('should change image wrapper', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -341,14 +341,14 @@ describe('Test image', function() { dialog.querySelector('.imageLink').value = 'https://xdsoft.net/'; simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); describe('open link in new tab', function () { it('should change image wrapper with target="_blank"', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -363,7 +363,7 @@ describe('Test image', function() { simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -371,7 +371,7 @@ describe('Test image', function() { it('should change image wrapper', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -387,7 +387,7 @@ describe('Test image', function() { simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -395,7 +395,7 @@ describe('Test image', function() { it('should remove image wrapper', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -411,7 +411,7 @@ describe('Test image', function() { simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); }); }); @@ -420,7 +420,7 @@ describe('Test image', function() { it('should create connected inputs with width and height', function (done) { var editor = new Jodit(appendTestArea()); - editor.value = ''; + editor.value = ''; var img= editor.editor.querySelector('img'); function doTest() { @@ -447,7 +447,7 @@ describe('Test image', function() { simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); done(); } @@ -463,7 +463,7 @@ describe('Test image', function() { it('should create connected inputs with width and height', function (done) { var editor = new Jodit(appendTestArea()); - editor.value = ''; + editor.value = ''; var img= editor.editor.querySelector('img'); function doTest() { @@ -493,7 +493,7 @@ describe('Test image', function() { simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); done(); } @@ -509,7 +509,7 @@ describe('Test image', function() { it('should create connected inputs with width and height', function (done) { var editor = new Jodit(appendTestArea()); - editor.value = ''; + editor.value = ''; var img= editor.editor.querySelector('img'); function doTest() { @@ -536,7 +536,7 @@ describe('Test image', function() { simulateEvent('click', 0, dialog.querySelectorAll('.jodit_dialog_footer a.jodit_button')[0]); - expect(sortAtrtibutes(editor.value)).to.be.equal(''); + expect(sortAtrtibutes(editor.value)).to.be.equal(''); done(); } @@ -556,7 +556,7 @@ describe('Test image', function() { it('should not show buttons', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -565,7 +565,7 @@ describe('Test image', function() { expect(dialog.querySelector('.jodit_button.jodit_use_image_editor')).to.be.equal(null) }); }); - describe('Uploader and filebrowser settings setted', function () { + describe('Uploader and filebrowser settings set', function () { var settings = { uploader: { url: 'https://xdsoft.net/jodit/connector/index.php?action=fileUpload' @@ -582,7 +582,7 @@ describe('Test image', function() { it('should not show buttons', function () { var editor = new Jodit(appendTestArea(), settings); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); @@ -594,7 +594,7 @@ describe('Test image', function() { it('should open popup', function () { var editor = new Jodit(appendTestArea(), settings); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); var rechange = dialog.querySelector('.jodit_button.jodit_rechange'); @@ -604,39 +604,41 @@ describe('Test image', function() { }); }); describe('Click on edit button', function () { - it('should open image editor', function (done) { + describe('When photo it is not my', function () { + it('should open image editor', function (done) { + var editor = new Jodit(appendTestArea(), settings); + editor.value = '' + simulateEvent('dblclick', 0, editor.editor.querySelector('img')); + var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); + expect(dialog).to.be.not.null; - var editor = new Jodit(appendTestArea(), settings); - - editor.setEditorValue('') - simulateEvent('dblclick', 0, editor.editor.querySelector('img')); - var dialog = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active[data-editor_id=' + editor.id + ']'); - var edi = dialog.querySelector('.jodit_button.jodit_use_image_editor'); - expect(edi).to.be.not.equal(null); + var edi = dialog.querySelector('.jodit_button.jodit_use_image_editor'); + expect(edi).to.be.not.null; - simulateEvent('mousedown', 0, edi); + simulateEvent('mousedown', 0, edi); - var dialog2 = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active.jodit_modal'); - expect(dialog2).to.be.not.equal(null); - expect(dialog2).to.be.not.equal(dialog); + var dialog2 = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active.jodit_modal'); + expect(dialog2).to.be.not.equal(null); + expect(dialog2).to.be.not.equal(dialog); - simulateEvent('click', 0, dialog2.querySelector('a.jodit_button')); + simulateEvent('click', 0, dialog2.querySelector('a.jodit_button')); - var dialog3 = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active.jodit_modal'); - expect(dialog3).to.be.not.equal(null); - expect(dialog3).to.be.not.equal(dialog2); + var dialog3 = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active.jodit_modal'); + expect(dialog3).to.be.not.equal(null); + expect(dialog3).to.be.not.equal(dialog2); - simulateEvent('click', 0, dialog3.querySelector('a.jodit_button')); + simulateEvent('click', 0, dialog3.querySelector('a.jodit_button')); - var dialog4 = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active.jodit_modal'); - expect(dialog4).to.be.not.equal(null); - expect(dialog4).to.be.not.equal(dialog3); - simulateEvent('click', 0, dialog4.querySelector('a.jodit_button')); + var dialog4 = editor.ownerDocument.querySelector('.jodit.jodit_dialog_box.active.jodit_modal'); + expect(dialog4).to.be.not.equal(null); + expect(dialog4).to.be.not.equal(dialog3); + simulateEvent('click', 0, dialog4.querySelector('a.jodit_button')); - expect(dialog.querySelector('.imageSrc').value).to.be.equal('https://xdsoft.net/jodit/files/artio.jpg') + expect(dialog.querySelector('.imageSrc').value).to.be.equal('https://xdsoft.net/jodit/files/artio.jpg') - done(); + done(); + }); }); }); }); @@ -646,7 +648,7 @@ describe('Test image', function() { var editor = new Jodit(appendTestArea(), { image: { openOnDblClick: false } }); - editor.setEditorValue('') + editor.setEditorValue('') simulateEvent('dblclick', 0, editor.editor.querySelector('img')); var dialogs = document.querySelectorAll('.jodit.jodit_dialog_box.active'); @@ -658,7 +660,7 @@ describe('Test image', function() { it('should show resizer', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('') + editor.setEditorValue('') var img = editor.editor.querySelector('img'); @@ -674,7 +676,7 @@ describe('Test image', function() { var editor = new Jodit(appendTestArea(), { fullsize: true }); - editor.value = '' + editor.value = '' var img = editor.editor.querySelector('img'); @@ -809,9 +811,50 @@ describe('Test image', function() { div.parentNode && div.parentNode.removeChild(div); }); }); - // describe('Resize image', function () { - // it('Should not be allow mo'); - // }); + describe('Resize image', function () { + it('Should not allow to resize image more then width of editor', function (done) { + box.style.width = '500px'; + var editor = new Jodit(appendTestArea()); + var image = new Image(); + image.src = 'tests/artio.jpg' + var doit = function () { + var ratio = image.naturalWidth / image.naturalHeight; + editor.value = ''; + var img = editor.editor.querySelector('img'); + simulateEvent('mousedown', 0, editor.editor.querySelector('img')); + var resizer = document.querySelector('.jodit_resizer[data-editor_id=' + editor.id + ']'); + expect(resizer).to.be.not.null; + + var positionResizer = offset(resizer); + // + + simulateEvent('mousedown', 0, resizer.getElementsByTagName('i')[1]); + simulateEvent('mousemove', 0, editor.ownerWindow, function (data) { + data.clientX = positionResizer.left + 1000; + data.clientY = positionResizer.top + 1000; + }); + + + simulateEvent('mouseup', 0, editor.ownerWindow, function (data) { + data.clientX = positionResizer.left + 1000; + data.clientY = positionResizer.top + 1000; + }); + + var newratio = img.offsetWidth / img.offsetHeight; + expect(img.offsetWidth).to.be.equal(editor.editor.offsetWidth - 20); + console.log(Math.abs(newratio - ratio)); + expect(Math.abs(newratio - ratio) < 0.003).to.be.true + done(); + }; + + if (image.complete) { + doit(); + } else { + image.onload = doit; + } + // expect(popup.parentNode).to.be.equal(null); + }); + }); }); diff --git a/test/tests/inlineModeTest.js b/test/tests/inlineModeTest.js index fac84c5f..44ddbf2a 100644 --- a/test/tests/inlineModeTest.js +++ b/test/tests/inlineModeTest.js @@ -150,7 +150,7 @@ describe('Test Inline mode', function () { toolbarInline: true, toolbarInlineDisableFor: 'a,IMG' }); - editor.value = '
    1

    test test > test

    ' + editor.value = '
    1

    test test > test

    ' var a = editor.editor.querySelector('a'); var img = editor.editor.querySelector('img'); var td = editor.editor.querySelector('td'); @@ -175,7 +175,7 @@ describe('Test Inline mode', function () { toolbarInline: true, toolbarInlineDisableFor: ['A','table'] }); - editor.value = '
    1

    test test > test

    ' + editor.value = '
    1

    test test > test

    ' var a = editor.editor.querySelector('a'); var img = editor.editor.querySelector('img'); var td = editor.editor.querySelector('td'); @@ -330,7 +330,7 @@ describe('Test Inline mode', function () { toolbarInline: true, toolbarInlineDisableFor: 'a,IMG' }); - editor.value = '
    1

    test test > test

    ' + editor.value = '
    1

    test test > test

    ' var a = editor.editor.querySelector('a'); var img = editor.editor.querySelector('img'); var td = editor.editor.querySelector('td'); @@ -356,7 +356,7 @@ describe('Test Inline mode', function () { toolbarInline: true, toolbarInlineDisableFor: ['A','table'] }); - editor.value = '
    1

    test test > test

    ' + editor.value = '
    1

    test test > test

    ' var a = editor.editor.querySelector('a'); var img = editor.editor.querySelector('img'); var td = editor.editor.querySelector('td'); diff --git a/test/tests/interfaceTest.js b/test/tests/interfaceTest.js index c26195af..1f30462c 100644 --- a/test/tests/interfaceTest.js +++ b/test/tests/interfaceTest.js @@ -533,10 +533,10 @@ describe('Test interface', function() { expect(url.classList.contains('jodit_error')).to.be.true; url.focus(); - url.value = 'https://xdsoft.net/jodit/images/artio.jpg' + url.value = 'tests/artio.jpg' simulateEvent('submit', 0, editor.container.querySelector('.jodit_toolbar_btn.jodit_toolbar_btn-link .jodit_form')) - expect(sortAtrtibutes(editor.value)).to.equal('123'); + expect(sortAtrtibutes(editor.value)).to.equal('123'); simulateEvent('mousedown', 0, editor.editor); @@ -572,10 +572,10 @@ describe('Test interface', function() { expect(text.value).to.be.equal('select'); url.focus(); - url.value = 'https://xdsoft.net/jodit/images/artio.jpg' + url.value = 'tests/artio.jpg' simulateEvent('submit', 0, editor.container.querySelector('.jodit_toolbar_btn.jodit_toolbar_btn-link .jodit_form')) - expect(sortAtrtibutes(editor.value)).to.equal('test select stop'); + expect(sortAtrtibutes(editor.value)).to.equal('test select stop'); simulateEvent('mousedown', 0, editor.editor); @@ -1192,7 +1192,7 @@ describe('Test interface', function() { it('Should Open inline popup', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue(''); + editor.setEditorValue(''); simulateEvent('mousedown', 0, editor.editor.querySelector('img')) @@ -1204,7 +1204,7 @@ describe('Test interface', function() { it('Should Open edit image dialog', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue(''); + editor.setEditorValue(''); simulateEvent('mousedown', 0, editor.editor.querySelector('img')) diff --git a/test/tests/pluginsTest.js b/test/tests/pluginsTest.js index 443162f4..5b05b703 100644 --- a/test/tests/pluginsTest.js +++ b/test/tests/pluginsTest.js @@ -105,9 +105,9 @@ describe('Test plugins', function () { it('Should copy format from one image to another', function () { getBox().style.width = 'auto'; var editor = new Jodit(appendTestArea()), - html = ' test ' + - ''; + ''; editor.value = html; expect(sortAtrtibutes(editor.value)).to.be.equal(sortAtrtibutes(html)); @@ -120,9 +120,9 @@ describe('Test plugins', function () { simulateEvent('mouseup', 0, editor.editor.querySelectorAll('img')[1]); expect(sortAtrtibutes(editor.value)).to.be.equal(sortAtrtibutes( - ' test ' + - '' ) ); @@ -283,7 +283,7 @@ describe('Test plugins', function () { describe('Insert line on top of IMG element that was inside P element', function () { it('Should insert new P before parent P element', function () { var editor = new Jodit(appendTestArea()); - editor.setEditorValue('

    '); + editor.setEditorValue('

    '); window.scrollTo(0, editor.helper.offset(editor.editor, editor, editor.ownerDocument).top) // elementFromPoint works only with visible part of view @@ -304,7 +304,7 @@ describe('Test plugins', function () { editor.selection.insertHTML('stop'); - expect('

    stop

    ').to.be.equal(sortAtrtibutes(editor.getEditorValue())); + expect('

    stop

    ').to.be.equal(sortAtrtibutes(editor.getEditorValue())); }); }); }); @@ -329,7 +329,7 @@ describe('Test plugins', function () { }, disablePlugins: 'mobile' }); - editor.setEditorValue(''); + editor.setEditorValue(''); simulateEvent('dblclick', 0, editor.editor.querySelector('img')); @@ -397,7 +397,7 @@ describe('Test plugins', function () { } }, }); - editor.setEditorValue(''); + editor.setEditorValue(''); simulateEvent('dblclick', 0, editor.editor.querySelector('img')); @@ -471,7 +471,7 @@ describe('Test plugins', function () { } }, }); - editor.setEditorValue(''); + editor.setEditorValue(''); simulateEvent('dblclick', 0, editor.editor.querySelector('img')); @@ -516,7 +516,7 @@ describe('Test plugins', function () { }); - expect(Math.abs(resizer.offsetWidth / resizer.offsetHeight - oldRatio) < 0.005).to.be.equal(true); + expect(Math.abs(resizer.offsetWidth / resizer.offsetHeight - oldRatio) < 0.009).to.be.equal(true); done(); }); @@ -540,7 +540,7 @@ describe('Test plugins', function () { } }, }); - editor.setEditorValue(''); + editor.setEditorValue(''); simulateEvent('dblclick', 0, editor.editor.querySelector('img')); diff --git a/test/tests/tableTest.js b/test/tests/tableTest.js index da65ea2b..d8fa43b4 100644 --- a/test/tests/tableTest.js +++ b/test/tests/tableTest.js @@ -1237,7 +1237,7 @@ describe('Tables Jodit Editor Tests', function() { '5' + '6' + '7' + - '' + + '' + '' + '');