ep_comments_page 0.1.97 → 1.0.1

package/static/tests/frontend/specs/commentSuggestion.js

@@ -1,66 +1,83 @@
 'use strict';
 
-describe('ep_comments_page - Comment Suggestion', function () {
-  // create a new pad before each test run
-  beforeEach(function (cb) {
-    helper.newPad(cb);
-    this.timeout(60000);
-  });
+const utils = require('../utils');
 
-  it('Fills suggestion Change From field when adding a comment with suggestion', async function () {
-    const chrome$ = helper.padChrome$;
+// create a new pad before each test run
+beforeEach(async function () {
+  this.timeout(60000);
+  await utils.aNewPad();
+});
 
-    // As in the function openCommentFormWithSuggestion we send all the text and call 'selectall',
-    // we select the beginning of line as well. This situation does not happen in the browser, it's
-    // not possible to select the beginning of first line of a selection. To fix this we add a first
-    // text without line attribute, in this case a <span>, to avoid select a '*'
-    const targetText = '<span>A</span><ul><li> text with</li><li> line attributes</li></ul>';
+it('Fills suggestion Change From field when adding a comment with suggestion', async function () {
+  const chrome$ = helper.padChrome$;
 
-    await openCommentFormWithSuggestion(targetText);
-    const $suggestionFrom = chrome$('.from-value');
-    expect($suggestionFrom.text()).to.be('A\n text with\n line attributes');
-  });
+  // As in the function openCommentFormWithSuggestion we send all the text and call 'selectall',
+  // we select the beginning of line as well. This situation does not happen in the browser, it's
+  // not possible to select the beginning of first line of a selection. To fix this we add a first
+  // text without line attribute, in this case a <span>, to avoid select a '*'
+  const targetText = '<span>A</span><ul><li> text with</li><li> line attributes</li></ul>';
+
+  await openCommentFormWithSuggestion(targetText);
+  const $suggestionFrom = chrome$('.from-value');
+  expect($suggestionFrom.text()).to.be('A\n text with\n line attributes');
+});
+
+it('Cancel suggestion and try again fills suggestion Change From field', async function () {
+  const outer$ = helper.padOuter$;
+  const chrome$ = helper.padChrome$;
 
-  it('Cancel suggestion and try again fills suggestion Change From field', async function () {
-    const outer$ = helper.padOuter$;
-    const chrome$ = helper.padChrome$;
+  await openCommentFormWithSuggestion('This content will receive a comment');
 
-    await openCommentFormWithSuggestion('This content will receive a comment');
+  // cancel
+  const $cancelButton = chrome$('#comment-reset');
+  $cancelButton.click();
 
-    // cancel
-    const $cancelButton = chrome$('#comment-reset');
-    $cancelButton.click();
+  // wait for comment form to close
+  await helper.waitForPromise(() => outer$('#newComments.active').length === 0);
+  await openCommentFormWithSuggestion('New target for comment');
 
-    // wait for comment form to close
-    await helper.waitForPromise(() => outer$('#newComments.active').length === 0);
-    await openCommentFormWithSuggestion('New target for comment');
+  const $suggestionFrom = chrome$('.from-value');
+  expect($suggestionFrom.text()).to.be('New target for comment');
+});
+
+it('Fills suggestion Change From field, adds sugestion', async function () {
+  const outer$ = helper.padOuter$;
+  const inner$ = helper.padInner$;
+  const chrome$ = helper.padChrome$;
+  const origText = 'This content will receive a comment';
+  const suggestedText = 'amp: & dq: " sq: \' lt: < gt: > bs: \\ end';
+  await openCommentFormWithSuggestion(origText);
 
-    const $suggestionFrom = chrome$('.from-value');
-    expect($suggestionFrom.text()).to.be('New target for comment');
+  await helper.waitForPromise(() => chrome$('#newComment.popup-show').is(':visible'));
+  chrome$('#newComment').find('textarea.comment-content').val('A new comment text');
+  chrome$('#newComment').find('suggestion-checkbox').click();
+  let newCommentSuggestion;
+  await helper.waitForPromise(() => {
+    newCommentSuggestion = chrome$('#newComment').find('textarea.to-value');
+    return newCommentSuggestion.length > 0 && newCommentSuggestion.is(':visible');
   });
+  newCommentSuggestion.val(suggestedText);
+  chrome$('#comment-create-btn').click();
 
-  it('Fills suggestion Change From field, adds sugestion', async function () {
-    const outer$ = helper.padOuter$;
-    const inner$ = helper.padInner$;
-    const chrome$ = helper.padChrome$;
-    const suggestedText = 'A new suggested text';
-    await openCommentFormWithSuggestion('This content will receive a comment');
-
-    await helper.waitForPromise(() => chrome$('#newComment.popup-show').is(':visible'));
-    chrome$('#newComment').find('textarea.comment-content').val('A new comment text');
-    chrome$('#newComment').find('textarea.to-value').val(suggestedText);
-    chrome$('#comment-create-btn').click();
-    await helper.waitForPromise(() => inner$('div').first().find('.comment').length);
-    let comment$ = inner$('div').first().find('.comment');
-    comment$.click();
-    await helper.waitForPromise(() => {
-      outer$('.approve-suggestion-btn:visible').click();
-      return true;
-    });
-    comment$ = inner$('div').first().find('.comment');
-    await helper.waitForPromise(() => comment$.text() === suggestedText);
-    expect(comment$.text()).to.be(suggestedText);
+  let commentedText$;
+  await helper.waitForPromise(() => {
+    commentedText$ = inner$('div').first().find('.comment');
+    return commentedText$.length > 0;
   });
+  commentedText$.click();
+  let comment$;
+  await helper.waitForPromise(() => {
+    comment$ = outer$('.comment-container');
+    const fd$ = comment$.find('.full-display-content');
+    return comment$.length > 0 && fd$.length > 0 && fd$.is(':visible');
+  });
+  await helper.waitForPromise(
+      () => comment$.find('.comment-title-wrapper .from-label').text().includes(suggestedText));
+
+  outer$('.approve-suggestion-btn:visible').click();
+  commentedText$ = inner$('div').first().find('.comment');
+  await helper.waitForPromise(
+      () => inner$('div').first().find('.comment').text() === suggestedText);
 });
 
 const openCommentFormWithSuggestion = async (targetText) => {

package/static/tests/frontend/specs/comment_l10n.js

@@ -1,137 +1,137 @@
 'use strict';
 
-describe('ep_comments_page - Comment Localization', function () {
-  // create a new pad with comment before each test run
-  beforeEach(function (cb) {
-    helper.newPad(() => {
-      createComment(() => {
-        // ensure we start on the default language
-        changeEtherpadLanguageTo('en', cb);
-      });
-    });
-    this.timeout(60000);
-  });
-
-  // ensure we go back to English to avoid breaking other tests:
-  after(function (cb) {
-    changeEtherpadLanguageTo('en', cb);
-  });
-
-  it('uses default values when language was not localized yet', function (done) {
-    changeEtherpadLanguageTo('oc', () => {
-      const outer$ = helper.padOuter$;
-
-      // get the title of the comment
-      const $changeToLabel = outer$('.comment-suggest').first();
-      expect($changeToLabel.text()).to.be(
-          '                                  Include suggested change             ');
-
-      done();
-    });
-  });
-
-  it('localizes comment when Etherpad language is changed', function (done) {
-    changeEtherpadLanguageTo('pt-br', () => {
-      const outer$ = helper.padOuter$;
-      const commentId = getCommentId();
-
-      // get the 'Suggested Change' label
-      const $changeToLabel = outer$(`#${commentId} .from-label`).first();
-      expect($changeToLabel.text()).to.be('Sugerir alteração de');
-
-      done();
-    });
-  });
-
-  it("localizes 'new comment' form when Etherpad language is changed", function (done) {
-    // make sure form was created before changing the language
-    const inner$ = helper.padInner$;
-    const outer$ = helper.padOuter$;
-    const chrome$ = helper.padChrome$;
-
-    // get the first text element out of the inner iframe
-    const $firstTextElement = inner$('div').first();
-
-    // get the comment button and click it
-    $firstTextElement.sendkeys('{selectall}'); // needs to select content to add comment to
-    const $commentButton = chrome$('.addComment');
-    $commentButton.click();
-
-    changeEtherpadLanguageTo('pt-br', () => {
-      // get the 'Include suggested change' label
-      const $changeToLabel = outer$('.new-comment label.label-suggestion-checkbox').first();
-      expect($changeToLabel.text()).to.be('Incluir alteração sugerida');
-
-      done();
-    });
-  });
-
-  /* ********** Helper functions ********** */
-
-  const createComment = (callback) => {
-    const inner$ = helper.padInner$;
-    const outer$ = helper.padOuter$;
-    const chrome$ = helper.padChrome$;
-
-    // get the first text element out of the inner iframe
-    const $firstTextElement = inner$('div').first();
-
-    // simulate key presses to delete content
-    $firstTextElement.sendkeys('{selectall}'); // select all
-    $firstTextElement.sendkeys('{del}'); // clear the first line
-    $firstTextElement.sendkeys('This content will receive a comment'); // insert text
-
-    // get the comment button and click it
-    $firstTextElement.sendkeys('{selectall}'); // needs to select content to add comment to
-    const $commentButton = chrome$('.addComment');
-    $commentButton.click();
-
-    // fill the comment form and submit it
-    const $commentField = chrome$('textarea.comment-content');
-    $commentField.val('My comment');
-    const $hasSuggestion = outer$('.suggestion-checkbox');
-    $hasSuggestion.click();
-    const $suggestionField = outer$('textarea.to-value');
-    $suggestionField.val('Change to this suggestion');
-    const $submittButton = chrome$('.comment-buttons input[type=submit]');
-    $submittButton.click();
-
-    // wait until comment is created and comment id is set
-    helper.waitFor(() => getCommentId() != null)
-        .done(callback);
-  };
+const utils = require('../utils');
 
-  const changeEtherpadLanguageTo = (lang, callback) => {
-    const boldTitles = {
-      'en': 'Bold (Ctrl+B)',
-      'pt-br': 'Negrito (Ctrl-B)',
-      'oc': 'Gras (Ctrl-B)',
-    };
-    const chrome$ = helper.padChrome$;
+const commentedText = 'This content will receive a comment';
+const suggestedText = 'Change to this suggestion';
 
-    // click on the settings button to make settings visible
-    const $settingsButton = chrome$('.buttonicon-settings');
-    $settingsButton.click();
+// create a new pad with comment before each test run
+beforeEach(async function () {
+  this.timeout(60000);
+  await utils.aNewPad();
+  await createComment();
+  await changeEtherpadLanguageTo('en');
+});
 
-    // select the language
-    const $language = chrome$('#languagemenu');
-    $language.val(lang);
-    $language.change();
+// ensure we go back to English to avoid breaking other tests:
+after(async function () {
+  await changeEtherpadLanguageTo('en');
+});
 
-    // hide settings again
-    $settingsButton.click();
+it('uses default values when language was not localized yet', async function () {
+  await changeEtherpadLanguageTo('oc');
+  const outer$ = helper.padOuter$;
 
-    helper.waitFor(() => chrome$('.buttonicon-bold').parent()[0].title === boldTitles[lang])
-        .done(callback);
-  };
+  // get the title of the comment
+  const $changeToLabel = outer$('.comment-suggest').first();
+  expect($changeToLabel.text()).to.be(
+      '                                  Include suggested change             ');
+});
 
-  const getCommentId = () => {
-    const inner$ = helper.padInner$;
-    const comment = inner$('.comment').first();
-    const cls = comment.attr('class');
-    const classCommentId = /(?:^| )(c-[A-Za-z0-9]*)/.exec(cls);
-    const commentId = (classCommentId) ? classCommentId[1] : null;
+it('localizes comment when Etherpad language is changed', async function () {
+  await changeEtherpadLanguageTo('pt-br');
+  const outer$ = helper.padOuter$;
+  const commentId = getCommentId();
 
-    return commentId;
-  };
+  // get the 'Suggested Change' label
+  const $changeToLabel = outer$(`#${commentId} .from-label`).first();
+  expect($changeToLabel.text())
+      .to.be(`Alteração sugerida de "${commentedText}" para "${suggestedText}"`);
 });
+
+it("localizes 'new comment' form when Etherpad language is changed", async function () {
+  // make sure form was created before changing the language
+  const inner$ = helper.padInner$;
+  const outer$ = helper.padOuter$;
+  const chrome$ = helper.padChrome$;
+
+  // get the first text element out of the inner iframe
+  const $firstTextElement = inner$('div').first();
+
+  // get the comment button and click it
+  $firstTextElement.sendkeys('{selectall}'); // needs to select content to add comment to
+  const $commentButton = chrome$('.addComment');
+  $commentButton.click();
+
+  await changeEtherpadLanguageTo('pt-br');
+  // get the 'Include suggested change' label
+  const $changeToLabel = outer$('.new-comment label.label-suggestion-checkbox').first();
+  expect($changeToLabel.text()).to.be('Incluir alteração sugerida');
+});
+
+/* ********** Helper functions ********** */
+
+const createComment = async () => {
+  const inner$ = helper.padInner$;
+  const chrome$ = helper.padChrome$;
+
+  // Returns the first line div. Must be a function because Etherpad might replace the div with a
+  // new div if the content changes.
+  const $firstTextElement = () => {
+    const $div = inner$('div').first();
+    expect($div.length).to.be(1);
+    return $div;
+  };
+
+  // simulate key presses to delete content
+  $firstTextElement().sendkeys('{selectall}'); // select all
+  $firstTextElement().sendkeys('{del}'); // clear the first line
+  $firstTextElement().sendkeys(commentedText); // insert text
+
+  // get the comment button and click it
+  $firstTextElement().sendkeys('{selectall}'); // needs to select content to add comment to
+  const $commentButton = chrome$('.addComment');
+  expect($commentButton.length).to.be(1);
+  $commentButton.click();
+
+  // fill the comment form and submit it
+  const $commentField = chrome$('textarea.comment-content');
+  expect($commentField.length).to.be(1);
+  $commentField.val('My comment');
+  const $hasSuggestion = chrome$('#newComment .suggestion-checkbox');
+  expect($hasSuggestion.length).to.be(1);
+  $hasSuggestion.click();
+  const $suggestionField = chrome$('textarea.to-value');
+  expect($suggestionField.length).to.be(1);
+  $suggestionField.val(suggestedText);
+  const $submittButton = chrome$('.comment-buttons input[type=submit]');
+  expect($submittButton.length).to.be(1);
+  $submittButton.click();
+
+  // wait until comment is created and comment id is set
+  await helper.waitForPromise(() => getCommentId() != null);
+};
+
+const changeEtherpadLanguageTo = async (lang) => {
+  const boldTitles = {
+    'en': 'Bold (Ctrl+B)',
+    'pt-br': 'Negrito (Ctrl-B)',
+    'oc': 'Gras (Ctrl-B)',
+  };
+  const chrome$ = helper.padChrome$;
+
+  // click on the settings button to make settings visible
+  const $settingsButton = chrome$('.buttonicon-settings');
+  $settingsButton.click();
+
+  // select the language
+  const $language = chrome$('#languagemenu');
+  $language.val(lang);
+  $language.change();
+
+  // hide settings again
+  $settingsButton.click();
+
+  await helper.waitForPromise(
+      () => chrome$('.buttonicon-bold').parent()[0].title === boldTitles[lang]);
+};
+
+const getCommentId = () => {
+  const inner$ = helper.padInner$;
+  const comment = inner$('.comment');
+  if (comment.length === 0) return null;
+  for (const cls of comment[0].classList) {
+    if (cls.startsWith('c-')) return cls;
+  }
+  return null;
+};

package/static/tests/frontend/specs/newComment.js

@@ -0,0 +1,18 @@
+'use strict';
+
+const utils = require('../utils');
+
+before(async function () {
+  await utils.aNewPad();
+  helper.padInner$('div').first()
+      .sendkeys('{selectall}')
+      .sendkeys('{del}')
+      .text('commented text')
+      .sendkeys('{selectall}');
+});
+
+it('new comment button focuses on comment textarea', async function () {
+  helper.padChrome$('.addComment').click();
+  expect(helper.padChrome$.document.activeElement)
+      .to.be(helper.padChrome$('#newComment').find('.comment-content')[0]);
+});