501 lines
13 KiB
JavaScript
501 lines
13 KiB
JavaScript
var chai = require('chai');
|
|
var chaiAsPromised = require('chai-as-promised');
|
|
|
|
var detailHelper = require('../helpers').detail;
|
|
var historyHelper = detailHelper.history();
|
|
|
|
var utils = require('../utils');
|
|
var EC = protractor.ExpectedConditions;
|
|
|
|
chai.use(chaiAsPromised);
|
|
var expect = chai.expect;
|
|
|
|
var shared = module.exports;
|
|
|
|
function selectEditorFirstChild(elm) {
|
|
browser.executeScript(function () {
|
|
// select the first paragraph
|
|
var range = document.createRange();
|
|
range.selectNode(arguments[0].firstChild);
|
|
|
|
var sel = window.getSelection();
|
|
sel.removeAllRanges();
|
|
sel.addRange(range);
|
|
}, elm.getWebElement());
|
|
|
|
browser.actions().mouseUp().perform(); // trigger medium events
|
|
}
|
|
|
|
function resetSelection() {
|
|
browser.executeScript(function () {
|
|
var sel = window.getSelection();
|
|
sel.removeAllRanges();
|
|
});
|
|
|
|
browser.actions().mouseUp().perform(); // trigger medium events
|
|
}
|
|
|
|
function getMarkdownText(elm) {
|
|
var markdownTextarea = getMarkdownTextarea(elm);
|
|
|
|
return markdownTextarea.getAttribute("value");
|
|
}
|
|
|
|
function getMarkdownTextarea(elm) {
|
|
return elm.$('.e2e-markdown-textarea');}
|
|
|
|
|
|
function htmlMode() {
|
|
$('.e2e-html-mode').click();
|
|
}
|
|
|
|
function markdownMode() {
|
|
$('.e2e-markdown-mode').click();
|
|
}
|
|
|
|
function saveEdition() {
|
|
$('.e2e-save-editor').click();
|
|
}
|
|
|
|
function cancelEdition(elm) {
|
|
$('.e2e-cancel-editor').click();
|
|
|
|
return browser.wait(async () => {
|
|
return !!await elm.$$('.read-mode').count();
|
|
}, 3000);
|
|
}
|
|
|
|
async function edit(elm, elmWrapper, text = null) {
|
|
await browser.wait(EC.elementToBeClickable(elm), 10000);
|
|
|
|
elm.click();
|
|
|
|
browser.sleep(200);
|
|
|
|
browser.executeScript(function () {
|
|
if(arguments[0].firstChild) {
|
|
var range = document.createRange();
|
|
range.setStart(arguments[0].firstChild, 0);
|
|
range.setEnd(arguments[0].lastChild, 0);
|
|
|
|
var sel = window.getSelection();
|
|
sel.removeAllRanges();
|
|
sel.addRange(range);
|
|
}
|
|
}, elm.getWebElement());
|
|
|
|
if (text !== null) {
|
|
await cleanWysiwyg(elm, elmWrapper);
|
|
|
|
return elm.sendKeys(text);
|
|
}
|
|
}
|
|
|
|
async function cleanWysiwyg(elm, elmWrapper) {
|
|
let isHtmlMode = await elm.isDisplayed();
|
|
|
|
if (isHtmlMode) {
|
|
let isPresent = await $('.e2e-markdown-mode').isPresent();
|
|
|
|
markdownMode();
|
|
}
|
|
var markdownTextarea = getMarkdownTextarea(elmWrapper);
|
|
|
|
await utils.common.clear(markdownTextarea);
|
|
|
|
return htmlMode();
|
|
}
|
|
|
|
shared.wysiwygTestingComments = function(parentSelector, section) {
|
|
var editor;
|
|
var editorWrapper;
|
|
|
|
beforeEach(() => {
|
|
let parent = $(parentSelector);
|
|
editor = parent.$('.medium');
|
|
editorWrapper = parent.$('tg-wysiwyg');
|
|
});
|
|
|
|
it('bold, test normal behavior and check markdown', async () => {
|
|
let commentsCounter = await historyHelper.countComments();
|
|
|
|
await edit(editor, editorWrapper, "test");
|
|
selectEditorFirstChild(editor);
|
|
|
|
$('.medium-editor-toolbar-active .medium-editor-action-bold').click();
|
|
|
|
resetSelection();
|
|
|
|
markdownMode();
|
|
|
|
let markdown = await getMarkdownText(editorWrapper);
|
|
|
|
expect(markdown).to.be.equal('**test**');
|
|
|
|
htmlMode();
|
|
|
|
saveEdition();
|
|
|
|
let newCommentsCounter = await historyHelper.countComments();
|
|
expect(newCommentsCounter).to.be.equal(commentsCounter+1);
|
|
});
|
|
|
|
it('convert to html', async () => {
|
|
let commentsCounter = await historyHelper.countComments();
|
|
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
markdownMode();
|
|
|
|
let markdownTextarea = getMarkdownTextarea(editorWrapper);
|
|
|
|
await markdownTextarea.sendKeys('_test2_');
|
|
|
|
htmlMode();
|
|
|
|
let html = await editor.getAttribute("innerHTML");
|
|
|
|
expect(html).to.be.eql('<p><em>test2</em></p>\n');
|
|
|
|
saveEdition();
|
|
|
|
let newCommentsCounter = await historyHelper.countComments();
|
|
expect(newCommentsCounter).to.be.equal(commentsCounter+1);
|
|
});
|
|
|
|
it('code block', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
editor.sendKeys("var test = 2;");
|
|
|
|
selectEditorFirstChild(editor);
|
|
|
|
$('.medium-editor-toolbar-active .medium-editor-button-last').click();
|
|
|
|
$('.code-language-selector').click();
|
|
$('.code-language-search input').sendKeys('javascript');
|
|
$('.code-language-search li').click();
|
|
|
|
saveEdition();
|
|
|
|
let lastComment = historyHelper.getComments().last();
|
|
|
|
let hasHightlighter = !!await lastComment.$$('.token').count();
|
|
|
|
expect(hasHightlighter).to.be.true;
|
|
});
|
|
|
|
it('confirm exit when there is changes', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
editor.sendKeys('text text text');
|
|
editor.sendKeys(protractor.Key.ESCAPE);
|
|
|
|
await utils.lightbox.confirm.ok();
|
|
|
|
let isReadMode = !!await editorWrapper.$$('.read-mode').count();
|
|
|
|
expect(isReadMode).to.be.true;
|
|
|
|
let html = await editor.getText();
|
|
|
|
expect(html).not.to.be.eql('text text text');
|
|
});
|
|
|
|
it('keep changes on reload', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
editor.sendKeys('text text text');
|
|
editor.sendKeys(protractor.Key.ESCAPE);
|
|
|
|
browser.sleep(400);
|
|
browser.refresh();
|
|
|
|
let isReadMode = !!await editorWrapper.$$('.read-mode').count();
|
|
|
|
expect(isReadMode).to.be.false;
|
|
|
|
let html = await editor.getText();
|
|
|
|
expect(html).to.be.eql('text text text');
|
|
|
|
await cancelEdition(editorWrapper);
|
|
});
|
|
|
|
it('mention user', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
editor.sendKeys('@use');
|
|
|
|
$$('.medium-mention li').get(2).click();
|
|
|
|
let html = await editor.getAttribute("innerHTML");
|
|
|
|
expect(html).to.be.eql('<p><a href="/profile/user8">@user8</a> </p>');
|
|
|
|
markdownMode();
|
|
|
|
let markdown = await getMarkdownText(editorWrapper);
|
|
|
|
expect(markdown).to.be.equal('[@user8](/profile/user8)');
|
|
|
|
htmlMode();
|
|
|
|
await cancelEdition(editorWrapper);
|
|
});
|
|
|
|
it('emojis', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
editor.sendKeys(':smil');
|
|
|
|
$$('.medium-mention li').get(2).click();
|
|
|
|
let html = await editor.getAttribute("innerHTML");
|
|
|
|
expect(html).to.include('1f604.png');
|
|
|
|
markdownMode();
|
|
|
|
let markdown = await getMarkdownText(editorWrapper);
|
|
|
|
expect(markdown).to.be.equal(':smile:');
|
|
|
|
htmlMode();
|
|
|
|
await cancelEdition(editorWrapper);
|
|
});
|
|
|
|
it('cancel', async () => {
|
|
let prevHtml = await editor.getAttribute("innerHTML");
|
|
|
|
await edit(editor, editorWrapper, 'xxx yyy zzz');
|
|
|
|
await cancelEdition(editorWrapper);
|
|
|
|
let html = await editor.getAttribute("innerHTML");
|
|
|
|
expect(html).to.be.equal(prevHtml);
|
|
});
|
|
|
|
it('edit comment', async () => {
|
|
historyHelper.editLastComment();
|
|
|
|
let editWrapperLast = historyHelper.getComments().last();
|
|
let editLast = editWrapperLast.$('.medium');
|
|
|
|
await edit(editLast, editWrapperLast, "This is the new and updated text");
|
|
await utils.common.takeScreenshot(section, "edit comment");
|
|
|
|
saveEdition();
|
|
|
|
//Show versions from last comment edited
|
|
historyHelper.showVersionsLastComment();
|
|
await utils.common.takeScreenshot(section, "show comment versions");
|
|
|
|
historyHelper.closeVersionsLastComment();
|
|
});
|
|
|
|
it('delete last comment', async () => {
|
|
let deletedCommentsCounter = await historyHelper.countDeletedComments();
|
|
await historyHelper.deleteLastComment();
|
|
|
|
let newDeletedCommentsCounter = await historyHelper.countDeletedComments();
|
|
|
|
expect(newDeletedCommentsCounter).to.be.equal(deletedCommentsCounter+1);
|
|
|
|
await utils.common.takeScreenshot(section, 'deleted comment');
|
|
});
|
|
|
|
it('restore last comment', async () => {
|
|
let deletedCommentsCounter = await historyHelper.countDeletedComments();
|
|
|
|
await historyHelper.restoreLastComment();
|
|
|
|
let newDeletedCommentsCounter = await historyHelper.countDeletedComments();
|
|
|
|
expect(newDeletedCommentsCounter).to.be.equal(deletedCommentsCounter-1);
|
|
|
|
await utils.common.takeScreenshot(section, 'restored comment');
|
|
});
|
|
};
|
|
|
|
shared.wysiwygTesting = function(parentSelector) {
|
|
var editor;
|
|
var editorWrapper;
|
|
|
|
beforeEach(async () => {
|
|
let isReadMode = !!await editorWrapper.$$('.read-mode').count();
|
|
|
|
if (isReadMode) {
|
|
editor.click();
|
|
}
|
|
|
|
await cleanWysiwyg(editor, editorWrapper);
|
|
|
|
markdownMode();
|
|
|
|
var markdownTextarea = getMarkdownTextarea(editorWrapper);
|
|
|
|
browser.wait(EC.elementToBeClickable(markdownTextarea), 10000);
|
|
|
|
await markdownTextarea.sendKeys('test');
|
|
|
|
htmlMode();
|
|
|
|
saveEdition();
|
|
|
|
await browser.wait(EC.elementToBeClickable(editor), 10000);
|
|
});
|
|
|
|
before(() => {
|
|
let parent = $(parentSelector);
|
|
editor = parent.$('.medium');
|
|
editorWrapper = parent.$('tg-wysiwyg');
|
|
});
|
|
|
|
it('bold, test normal behavior and check markdown', async () => {
|
|
await edit(editor, editorWrapper, "test");
|
|
selectEditorFirstChild(editor);
|
|
|
|
$('.medium-editor-toolbar-active .medium-editor-action-bold').click();
|
|
|
|
resetSelection();
|
|
|
|
let html = await editor.getAttribute("innerHTML");
|
|
|
|
expect(html).to.be.eql('<p><b>test</b></p>');
|
|
|
|
saveEdition();
|
|
|
|
await edit(editor, editorWrapper);
|
|
|
|
markdownMode();
|
|
|
|
let markdown = await getMarkdownText(editorWrapper);
|
|
|
|
expect(markdown).to.be.equal('**test**');
|
|
});
|
|
|
|
it('convert to html', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
markdownMode();
|
|
|
|
let markdownTextarea = getMarkdownTextarea(editorWrapper);
|
|
|
|
await markdownTextarea.sendKeys('_test2_');
|
|
|
|
htmlMode();
|
|
|
|
let html = await editor.getAttribute("innerHTML");
|
|
|
|
expect(html).to.be.eql('<p><em>test2</em></p>\n');
|
|
});
|
|
|
|
it('code block', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
editor.sendKeys("var test = 2;");
|
|
|
|
selectEditorFirstChild(editor);
|
|
|
|
$('.medium-editor-toolbar-active .medium-editor-button-last').click();
|
|
|
|
$('.code-language-selector').click();
|
|
$('.code-language-search input').sendKeys('javascript');
|
|
$('.code-language-search li').click();
|
|
|
|
saveEdition();
|
|
|
|
let hasHightlighter = !!await editor.$$('.token').count();
|
|
|
|
expect(hasHightlighter).to.be.true;
|
|
});
|
|
|
|
it('save with confirmconfirm exit when there is changes', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
editor.sendKeys('text text text');
|
|
editor.sendKeys(protractor.Key.ESCAPE);
|
|
|
|
await utils.lightbox.confirm.ok();
|
|
|
|
let isReadMode = !!await editorWrapper.$$('.read-mode').count();
|
|
|
|
expect(isReadMode).to.be.true;
|
|
|
|
let html = await editor.getText();
|
|
|
|
expect(html).not.to.be.eql('text text text');
|
|
});
|
|
|
|
it('keep changes on reload', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
editor.sendKeys('text text text');
|
|
editor.sendKeys(protractor.Key.ESCAPE);
|
|
|
|
browser.sleep(400);
|
|
browser.refresh();
|
|
|
|
let isReadMode = !!await editorWrapper.$$('.read-mode').count();
|
|
|
|
expect(isReadMode).to.be.false;
|
|
|
|
let html = await editor.getText();
|
|
|
|
expect(html).to.be.eql('text text text');
|
|
});
|
|
|
|
it('mention user', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
editor.sendKeys('@use');
|
|
|
|
$$('.medium-mention li').get(2).click();
|
|
|
|
let html = await editor.getAttribute("innerHTML");
|
|
|
|
expect(html).to.be.eql('<p><a href="/profile/user8">@user8</a> </p>');
|
|
|
|
markdownMode();
|
|
|
|
let markdown = await getMarkdownText(editorWrapper);
|
|
|
|
expect(markdown).to.be.equal('[@user8](/profile/user8)');
|
|
|
|
htmlMode();
|
|
});
|
|
|
|
it('emojis', async () => {
|
|
await edit(editor, editorWrapper, '');
|
|
|
|
editor.sendKeys(':smil');
|
|
|
|
$$('.medium-mention li').get(2).click();
|
|
|
|
let html = await editor.getAttribute("innerHTML");
|
|
|
|
expect(html).to.include('1f604.png');
|
|
|
|
markdownMode();
|
|
|
|
let markdown = await getMarkdownText(editorWrapper);
|
|
|
|
expect(markdown).to.be.equal(':smile:');
|
|
});
|
|
|
|
it('cancel', async () => {
|
|
let prevHtml = await editor.getAttribute("innerHTML");
|
|
|
|
await edit(editor, editorWrapper, 'xxx yyy zzz');
|
|
|
|
await cancelEdition(editorWrapper);
|
|
|
|
let html = await editor.getAttribute("innerHTML");
|
|
|
|
expect(html).to.be.equal(prevHtml);
|
|
});
|
|
};
|