Redmine

function quoteReply(path, selectorForContentElement, textFormatting) {

  const selectedRange = QuoteExtractor.extract(contentElement);

  let formatter;

  if (textFormatting === 'common_mark') {

    formatter = new QuoteCommonMarkFormatter();

  } else {

    formatter = new QuoteTextFormatter();

  }

    data: { quote: formatter.format(selectedRange) }

    const range = this.retriveSelectedRange();

    return range;

  retriveSelectedRange() {

class QuoteTextFormatter {

  format(selectedRange) {

    if (!selectedRange) {

      return null;

    }

    const fragment = document.createElement('div');

    fragment.appendChild(selectedRange.cloneContents());

    // Remove all unnecessary anchor elements

    fragment.querySelectorAll('a.wiki-anchor').forEach(e => e.remove());

    // Adjust line breaks when output as text

    const html = this.adjustLineBreaks(fragment.innerHTML);

    const result = document.createElement('div');

    result.innerHTML = html;

    // Replace continuous line breaks with a single line break and remove tab characters

    return result.textContent

      .trim()

      .replace(/\t/g, '')

      .replace(/\n+/g, "\n");

  }

  adjustLineBreaks(html) {

    return html

      .replace(/<\/(h1|h2|h3|h4|div|p|li|tr)>/g, "\n</$1>")

      .replace(/<br>/g, "\n")

  }

}

class QuoteCommonMarkFormatter {

  format(selectedRange) {

    if (!selectedRange) {

      return null;

    }

    const htmlFragment = this.extractHtmlFragmentFrom(selectedRange);

    const preparedHtml = this.prepareHtml(htmlFragment);

    return this.convertHtmlToCommonMark(preparedHtml);

  }

  extractHtmlFragmentFrom(range) {

    const fragment = document.createElement('div');

    const ancestorNodeName = range.commonAncestorContainer.nodeName;

    if (ancestorNodeName == 'CODE' || ancestorNodeName == '#text') {

      fragment.appendChild(this.wrapPreCode(range));

    } else {

      fragment.appendChild(range.cloneContents());

    }

    return fragment;

  }

  // When only the content within the `<code>` element is selected,

  // the HTML within the selection range does not include the `<pre><code>` element itself.

  // To create a complete code block, wrap the selected content with the `<pre><code>` tags.

  //

  // selected contentes => <pre><code class="ruby">selected contents</code></pre>

  wrapPreCode(range) {

    const rangeAncestor = range.commonAncestorContainer;

    let codeElement = null;

    if (rangeAncestor.nodeName == 'CODE') {

      codeElement = rangeAncestor;

    } else {

      codeElement = rangeAncestor.parentElement.closest('code');

    }

    if (!codeElement) {

      return range.cloneContents();

    }

    const pre = document.createElement('pre');

    const code = codeElement.cloneNode(false);

    code.appendChild(range.cloneContents());

    pre.appendChild(code);

    return pre;

  }

  convertHtmlToCommonMark(html) {

    const turndownService = new TurndownService({

      codeBlockStyle: 'fenced',

      headingStyle: 'atx'

    });

    turndownService.addRule('del', {

      filter: ['del'],

      replacement: content => `~~${content}~~`

    });

    turndownService.addRule('checkList', {

      filter: node => {

        return node.type === 'checkbox' && node.parentNode.nodeName === 'LI';

      },

      replacement: (content, node) => {

        return node.checked ? '[x]' : '[ ]';

      }

    });

    // Table elements are not formatted, and the within the table is output as is.

    //

    // | A | B | C |

    // |---|---|---|

    // | 1 | 2 | 3 |

    // =>

    // A B C

    // 1 2 3

    turndownService.addRule('table', {

      filter: (node, options) => {

        return node.nodeName === 'TD' || node.nodeName === 'TH';

      },

      replacement: (content, node) => {

        const separator = node.parentElement.lastElementChild === node ? '' : ' ';

        return content + separator;

      }

    });

    turndownService.addRule('tableHeading', {

      filter: ['thead', 'tbody', 'tfoot', 'tr'],

      replacement: (content, _node) => content

    });

    turndownService.addRule('tableRow', {

      filter: ['tr'],

      replacement: (content, _node) => {

        return content + '\n'

      }

    });

    return turndownService.turndown(html);

  }

  prepareHtml(htmlFragment) {

    // Remove all anchor elements.

    // <h1>Title1<a href="#Title" class="wiki-anchor">¶</a></h1> => <h1>Title1</h1>

    htmlFragment.querySelectorAll('a.wiki-anchor').forEach(e => e.remove());

    // Convert code highlight blocks to CommonMark code blocks.

    // <code class="ruby" data-language="ruby"> => <code class="language-ruby" data-language="ruby">

    htmlFragment.querySelectorAll('code[data-language]').forEach(e => {

      e.classList.replace(e.dataset['language'], 'language-' + e.dataset['language'])

    });

    return htmlFragment.innerHTML;

  }

}

/*

 * Turndown v7.2.0

 * https://github.com/mixmark-io/turndown

 * Copyright (c) 2017 Dom Christie

 * Released under the MIT license

 * https://github.com/mixmark-io/turndown/blob/master/LICENSE

 */

var TurndownService=(()=>{function u(e,n){return Array(n+1).join(e)}var n=["ADDRESS","ARTICLE","ASIDE","AUDIO","BLOCKQUOTE","BODY","CANVAS","CENTER","DD","DIR","DIV","DL","DT","FIELDSET","FIGCAPTION","FIGURE","FOOTER","FORM","FRAMESET","H1","H2","H3","H4","H5","H6","HEADER","HGROUP","HR","HTML","ISINDEX","LI","MAIN","MENU","NAV","NOFRAMES","NOSCRIPT","OL","OUTPUT","P","PRE","SECTION","TABLE","TBODY","TD","TFOOT","TH","THEAD","TR","UL"];function f(e){return o(e,n)}var r=["AREA","BASE","BR","COL","COMMAND","EMBED","HR","IMG","INPUT","KEYGEN","LINK","META","PARAM","SOURCE","TRACK","WBR"];function d(e){return o(e,r)}var i=["A","TABLE","THEAD","TBODY","TFOOT","TH","TD","IFRAME","SCRIPT","AUDIO","VIDEO"];function o(e,n){return 0<=n.indexOf(e.nodeName)}function a(n,e){return n.getElementsByTagName&&e.some(function(e){return n.getElementsByTagName(e).length})}var t={};function c(e){return e?e.replace(/(\n+\s*)+/g,"\n"):""}function l(e){for(var n in this.options=e,this._keep=[],this._remove=[],this.blankRule={replacement:e.blankReplacement},this.keepReplacement=e.keepReplacement,this.defaultRule={replacement:e.defaultReplacement},this.array=[],e.rules)this.array.push(e.rules[n])}function s(e,n,t){for(var r=0;r<e.length;r++){var i=e[r];if(((e,n,t)=>{var r=e.filter;if("string"==typeof r)return r===n.nodeName.toLowerCase();if(Array.isArray(r))return-1<r.indexOf(n.nodeName.toLowerCase());if("function"==typeof r)return!!r.call(e,n,t);throw new TypeError("`filter` needs to be a string, array, or function")})(i,n,t))return i}}function p(e){var n=e.nextSibling||e.parentNode;return e.parentNode.removeChild(e),n}function h(e,n,t){return e&&e.parentNode===n||t(n)?n.nextSibling||n.parentNode:n.firstChild||n.nextSibling||n.parentNode}t.paragraph={filter:"p",replacement:function(e){return"\n\n"+e+"\n\n"}},t.lineBreak={filter:"br",replacement:function(e,n,t){return t.br+"\n"}},t.heading={filter:["h1","h2","h3","h4","h5","h6"],replacement:function(e,n,t){n=Number(n.nodeName.charAt(1));return"setext"===t.headingStyle&&n<3?"\n\n"+e+"\n"+u(1===n?"=":"-",e.length)+"\n\n":"\n\n"+u("#",n)+" "+e+"\n\n"}},t.blockquote={filter:"blockquote",replacement:function(e){return"\n\n"+(e=(e=e.replace(/^\n+|\n+$/g,"")).replace(/^/gm,"> "))+"\n\n"}},t.list={filter:["ul","ol"],replacement:function(e,n){var t=n.parentNode;return"LI"===t.nodeName&&t.lastElementChild===n?"\n"+e:"\n\n"+e+"\n\n"}},t.listItem={filter:"li",replacement:function(e,n,t){e=e.replace(/^\n+/,"").replace(/\n+$/,"\n").replace(/\n/gm,"\n    ");var r,t=t.bulletListMarker+"   ",i=n.parentNode;return"OL"===i.nodeName&&(r=i.getAttribute("start"),i=Array.prototype.indexOf.call(i.children,n),t=(r?Number(r)+i:i+1)+".  "),t+e+(n.nextSibling&&!/\n$/.test(e)?"\n":"")}},t.indentedCodeBlock={filter:function(e,n){return"indented"===n.codeBlockStyle&&"PRE"===e.nodeName&&e.firstChild&&"CODE"===e.firstChild.nodeName},replacement:function(e,n,t){return"\n\n    "+n.firstChild.textContent.replace(/\n/g,"\n    ")+"\n\n"}},t.fencedCodeBlock={filter:function(e,n){return"fenced"===n.codeBlockStyle&&"PRE"===e.nodeName&&e.firstChild&&"CODE"===e.firstChild.nodeName},replacement:function(e,n,t){for(var r,i=((n.firstChild.getAttribute("class")||"").match(/language-(\S+)/)||[null,""])[1],o=n.firstChild.textContent,n=t.fence.charAt(0),a=3,l=new RegExp("^"+n+"{3,}","gm");r=l.exec(o);)r[0].length>=a&&(a=r[0].length+1);t=u(n,a);return"\n\n"+t+i+"\n"+o.replace(/\n$/,"")+"\n"+t+"\n\n"}},t.horizontalRule={filter:"hr",replacement:function(e,n,t){return"\n\n"+t.hr+"\n\n"}},t.inlineLink={filter:function(e,n){return"inlined"===n.linkStyle&&"A"===e.nodeName&&e.getAttribute("href")},replacement:function(e,n){var t=(t=n.getAttribute("href"))&&t.replace(/([()])/g,"\\$1"),n=c(n.getAttribute("title"));return"["+e+"]("+t+(n=n&&' "'+n.replace(/"/g,'\\"')+'"')+")"}},t.referenceLink={filter:function(e,n){return"referenced"===n.linkStyle&&"A"===e.nodeName&&e.getAttribute("href")},replacement:function(e,n,t){var r=n.getAttribute("href"),i=(i=c(n.getAttribute("title")))&&' "'+i+'"';switch(t.linkReferenceStyle){case"collapsed":a="["+e+"][]",l="["+e+"]: "+r+i;break;case"shortcut":a="["+e+"]",l="["+e+"]: "+r+i;break;default:var o=this.references.length+1,a="["+e+"]["+o+"]",l="["+o+"]: "+r+i}return this.references.push(l),a},references:[],append:function(e){var n="";return this.references.length&&(n="\n\n"+this.references.join("\n")+"\n\n",this.references=[]),n}},t.emphasis={filter:["em","i"],replacement:function(e,n,t){return e.trim()?t.emDelimiter+e+t.emDelimiter:""}},t.strong={filter:["strong","b"],replacement:function(e,n,t){return e.trim()?t.strongDelimiter+e+t.strongDelimiter:""}},t.code={filter:function(e){var n=e.previousSibling||e.nextSibling,n="PRE"===e.parentNode.nodeName&&!n;return"CODE"===e.nodeName&&!n},replacement:function(e){if(!e)return"";e=e.replace(/\r?\n|\r/g," ");for(var n=/^`|^ .*?[^ ].* $|`$/.test(e)?" ":"",t="`",r=e.match(/`+/gm)||[];-1!==r.indexOf(t);)t+="`";return t+n+e+n+t}},t.image={filter:"img",replacement:function(e,n){var t=c(n.getAttribute("alt")),r=n.getAttribute("src")||"",n=c(n.getAttribute("title"));return r?"!["+t+"]("+r+(n?' "'+n+'"':"")+")":""}},l.prototype={add:function(e,n){this.array.unshift(n)},keep:function(e){this._keep.unshift({filter:e,replacement:this.keepReplacement})},remove:function(e){this._remove.unshift({filter:e,replacement:function(){return""}})},forNode:function(e){return e.isBlank?this.blankRule:s(this.array,e,this.options)||s(this._keep,e,this.options)||s(this._remove,e,this.options)||this.defaultRule},forEach:function(e){for(var n=0;n<this.array.length;n++)e(this.array[n],n)}};var g,m="undefined"!=typeof window?window:{},A=(()=>{var e=m.DOMParser,n=!1;try{(new e).parseFromString("","text/html")&&(n=!0)}catch(e){}return n})()?m.DOMParser:((()=>{var n=!1;try{document.implementation.createHTMLDocument("").open()}catch(e){m.ActiveXObject&&(n=!0)}return n})()?e.prototype.parseFromString=function(e){var n=new window.ActiveXObject("htmlfile");return n.designMode="on",n.open(),n.write(e),n.close(),n}:e.prototype.parseFromString=function(e){var n=document.implementation.createHTMLDocument("");return n.open(),n.write(e),n.close(),n},e);function e(){}function y(e,n){var n={element:e="string"==typeof e?(g=g||new A).parseFromString('<x-turndown id="turndown-root">'+e+"</x-turndown>","text/html").getElementById("turndown-root"):e.cloneNode(!0),isBlock:f,isVoid:d,isPre:n.preformattedCode?v:null},t=n.element,r=n.isBlock,i=n.isVoid,o=n.isPre||function(e){return"PRE"===e.nodeName};if(t.firstChild&&!o(t)){for(var a=null,l=!1,u=h(s=null,t,o);u!==t;){if(3===u.nodeType||4===u.nodeType){var c=u.data.replace(/[ \r\n\t]+/g," ");if(!(c=a&&!/ $/.test(a.data)||l||" "!==c[0]?c:c.substr(1))){u=p(u);continue}u.data=c,a=u}else{if(1!==u.nodeType){u=p(u);continue}r(u)||"BR"===u.nodeName?(a&&(a.data=a.data.replace(/ $/,"")),a=null,l=!1):i(u)||o(u)?l=!(a=null):a&&(l=!1)}var c=h(s,u,o),s=u,u=c}a&&(a.data=a.data.replace(/ $/,""),a.data||p(a))}return e}function v(e){return"PRE"===e.nodeName||"CODE"===e.nodeName}function N(e,n){var t;return e.isBlock=f(e),e.isCode="CODE"===e.nodeName||e.parentNode.isCode,e.isBlank=!d(t=e)&&!(e=>o(e,i))(t)&&/^\s*$/i.test(t.textContent)&&!(e=>a(e,r))(t)&&!(e=>a(e,i))(t),e.flankingWhitespace=((e,n)=>{var t;return e.isBlock||n.preformattedCode&&e.isCode?{leading:"",trailing:""}:((t=(e=>({leading:(e=e.match(/^(([ \t\r\n]*)(\s*))(?:(?=\S)[\s\S]*\S)?((\s*?)([ \t\r\n]*))$/))[1],leadingAscii:e[2],leadingNonAscii:e[3],trailing:e[4],trailingNonAscii:e[5],trailingAscii:e[6]}))(e.textContent)).leadingAscii&&E("left",e,n)&&(t.leading=t.leadingNonAscii),t.trailingAscii&&E("right",e,n)&&(t.trailing=t.trailingNonAscii),{leading:t.leading,trailing:t.trailing})})(e,n),e}function E(e,n,t){var r,i,e="left"===e?(r=n.previousSibling,/ $/):(r=n.nextSibling,/^ /);return r&&(3===r.nodeType?i=e.test(r.nodeValue):t.preformattedCode&&"CODE"===r.nodeName?i=!1:1!==r.nodeType||f(r)||(i=e.test(r.textContent))),i}var T=Array.prototype.reduce,R=[[/\\/g,"\\\\"],[/\*/g,"\\*"],[/^-/g,"\\-"],[/^\+ /g,"\\+ "],[/^(=+)/g,"\\$1"],[/^(#{1,6}) /g,"\\$1 "],[/`/g,"\\`"],[/^~~~/g,"\\~~~"],[/\[/g,"\\["],[/\]/g,"\\]"],[/^>/g,"\\>"],[/_/g,"\\_"],[/^(\d+)\. /g,"$1\\. "]];function C(e){if(!(this instanceof C))return new C(e);this.options=function(e){for(var n=1;n<arguments.length;n++){var t,r=arguments[n];for(t in r)r.hasOwnProperty(t)&&(e[t]=r[t])}return e}({},{rules:t,headingStyle:"setext",hr:"* * *",bulletListMarker:"*",codeBlockStyle:"indented",fence:"```",emDelimiter:"_",strongDelimiter:"**",linkStyle:"inlined",linkReferenceStyle:"full",br:"  ",preformattedCode:!1,blankReplacement:function(e,n){return n.isBlock?"\n\n":""},keepReplacement:function(e,n){return n.isBlock?"\n\n"+n.outerHTML+"\n\n":n.outerHTML},defaultReplacement:function(e,n){return n.isBlock?"\n\n"+e+"\n\n":e}},e),this.rules=new l(this.options)}function k(e){var r=this;return T.call(e.childNodes,function(e,n){var t="";return 3===(n=new N(n,r.options)).nodeType?t=n.isCode?n.nodeValue:r.escape(n.nodeValue):1===n.nodeType&&(t=function(e){var n=this.rules.forNode(e),t=k.call(this,e),r=e.flankingWhitespace;(r.leading||r.trailing)&&(t=t.trim());return r.leading+n.replacement(t,e,this.options)+r.trailing}.call(r,n)),b(e,t)},"")}function b(e,n){var t=(e=>{for(var n=e.length;0<n&&"\n"===e[n-1];)n--;return e.substring(0,n)})(e),r=n.replace(/^\n*/,""),e=Math.max(e.length-t.length,n.length-r.length);return t+"\n\n".substring(0,e)+r}return C.prototype={turndown:function(e){if(null==(n=e)||"string"!=typeof n&&(!n.nodeType||1!==n.nodeType&&9!==n.nodeType&&11!==n.nodeType))throw new TypeError(e+" is not a string, or an element/document/fragment node.");var n;return""===e?"":(n=k.call(this,new y(e,this.options)),function(n){var t=this;return this.rules.forEach(function(e){"function"==typeof e.append&&(n=b(n,e.append(t.options)))}),n.replace(/^[\t\r\n]+/,"").replace(/[\t\r\n\s]+$/,"")}.call(this,n))},use:function(e){if(Array.isArray(e))for(var n=0;n<e.length;n++)this.use(e[n]);else{if("function"!=typeof e)throw new TypeError("plugin must be a Function or an Array of Functions");e(this)}return this},addRule:function(e,n){return this.rules.add(e,n),this},keep:function(e){return this.rules.keep(e),this},remove:function(e){return this.rules.remove(e),this},escape:function(e){return R.reduce(function(e,n){return e.replace(n[0],n[1])},e)}},C})();

  <%= javascripts_for_quote_reply_include_tag %>

  <%= javascripts_for_quote_reply_include_tag %>

      def javascripts_for_quote_reply_include_tag

        javascript_include_tag 'turndown-7.2.0.min', 'quote_reply'

        quote_reply_function = "quoteReply('#{j url}', '#{j selector_for_content}', '#{j Setting.text_formatting}')"

    with_text_formatting 'common_mark' do

      within '.issue.details' do

        click_link 'Quote'

      end

      # Select the other than the issue description element.

      page.execute_script <<-JS

        const range = document.createRange();

        // Select "Description" text.

        range.selectNodeContents(document.querySelector('.description > p'))

        window.getSelection().addRange(range);

      JS

      assert_field 'issue_notes', with: <<~TEXT

        John Smith wrote:

        > Unable to print recipes

      TEXT

      assert_selector :css, '#issue_notes:focus'

    end

    with_text_formatting 'textile' do

      within '#change-1' do

        click_link 'Quote'

      end

      assert_field 'issue_notes', with: <<~TEXT

        Redmine Admin wrote in #note-1:

        > Journal notes

      TEXT

      assert_selector :css, '#issue_notes:focus'

    end

    with_text_formatting 'common_mark' do

      assert_text 'Unable to print recipes'

      # Select only the "print" text from the text "Unable to print recipes" in the description.

      page.execute_script <<-JS

        const range = document.createRange();

        const wiki = document.querySelector('#issue_description_wiki > p').childNodes[0];

        range.setStart(wiki, 10);

        range.setEnd(wiki, 15);

        window.getSelection().addRange(range);

      JS

      within '.issue.details' do

        click_link 'Quote'

      end

      assert_field 'issue_notes', with: <<~TEXT

        John Smith wrote:

        > print

      TEXT

      assert_selector :css, '#issue_notes:focus'

    end

    with_text_formatting 'textile' do

      assert_text 'Journal notes'

      # Select the entire details of the note#1 and the part of the note#1's text.

      page.execute_script <<-JS

        const range = document.createRange();

        range.setStartBefore(document.querySelector('#change-1 .details'));

        // Select only the text "Journal" from the text "Journal notes" in the note-1.

        range.setEnd(document.querySelector('#change-1 .wiki > p').childNodes[0], 7);

        window.getSelection().addRange(range);

      JS

      within '#change-1' do

        click_link 'Quote'

      end

      assert_field 'issue_notes', with: <<~TEXT

        Redmine Admin wrote in #note-1:

        > Journal

      TEXT

      assert_selector :css, '#issue_notes:focus'

  end

  def test_partial_quotes_should_be_quoted_in_plain_text_when_text_format_is_textile

    issues(:issues_001).update!(description: <<~DESC)

      # "Redmine":https://redmine.org is

      # a *flexible* project management

      # web application.

    DESC

    with_text_formatting 'textile' do

      assert_text /a flexible project management/

      # Select the entire description of the issue.

      page.execute_script <<-JS

        const range = document.createRange();

        range.selectNodeContents(document.querySelector('#issue_description_wiki'))

        window.getSelection().addRange(range);

      JS

      within '.issue.details' do

        click_link 'Quote'

      end

      expected_value = [

        'John Smith wrote:',

        '> Redmine is',

        '> a flexible project management',

        '> web application.',

        '',

        ''

      ]

      assert_equal expected_value.join("\n"), find_field('issue_notes').value

    end

  end

  def test_partial_quotes_should_be_quoted_in_common_mark_format_when_text_format_is_common_mark

    issues(:issues_001).update!(description: <<~DESC)

      # Title1

      [Redmine](https://redmine.org) is a **flexible** project management web application.

      ## Title2

      * List1

        * List1-1

      * List2

      1. Number1

      1. Number2

      ### Title3

      ```ruby

      puts "Hello, world!"

      ```

      ```

      $ bin/rails db:migrate

      ```

      | Subject1 | Subject2 |

      | -------- | -------- |

      | ~~cell1~~| **cell2**|

      * [ ] Checklist1

      * [x] Checklist2

      [[WikiPage]]

      Issue #14

      Issue ##2

      Redmine is `a flexible` project management

      web application.

    DESC

    with_text_formatting 'common_mark' do

      assert_text /Title1/

      # Select the entire description of the issue.

      page.execute_script <<-JS

        const range = document.createRange();

        range.selectNodeContents(document.querySelector('#issue_description_wiki'))

        window.getSelection().addRange(range);

      JS

      within '.issue.details' do

        click_link 'Quote'

      end

      expected_value = [

        'John Smith wrote:',

        '> # Title1',

        '> ',

        '> [Redmine](https://redmine.org) is a **flexible** project management web application.',

        '> ',

        '> ## Title2',

        '> ',

        '> *   List1',

        '>     *   List1-1',

        '> *   List2',

        '> ',

        '> 1.  Number1',

        '> 2.  Number2',

        '> ',

        '> ### Title3',

        '> ',

        '> ```ruby',

        '> puts "Hello, world!"',

        '> ```',

        '> ',

        '> ```',

        '> $ bin/rails db:migrate',

        '> ```',

        '> ',

        '> Subject1 Subject2',

        '> ~~cell1~~ **cell2**',

        '> ',

        '> *   [ ] Checklist1',

        '> *   [x] Checklist2',

        '> ',

        '> [WikiPage](/projects/ecookbook/wiki/WikiPage)  ',

        '> Issue [#14](/issues/14 "Bug: Private issue on public project (New)")  ',

        '> Issue [Feature request #2: Add ingredients categories](/issues/2 "Status: Assigned")',

        '> ',

        '> Redmine is `a flexible` project management',

        '> ',

        '> web application.',

        '',

        ''

      ]

      assert_equal expected_value.join("\n"), find_field('issue_notes').value

    end

  end

  private

  def with_text_formatting(format)

    with_settings text_formatting: format do

      log_user('jsmith', 'jsmith')

      visit '/issues/1'

      yield

    end

    with_text_formatting 'common_mark' do

      within '#content > .contextual' do

        click_link 'Quote'

      end

      assert_field 'message_content', with: <<~TEXT

        Redmine Admin wrote:

        > This is the very first post

        > in the forum

      TEXT

    end

    with_text_formatting 'textile' do

      within '#message-2' do

        click_link 'Quote'

      end

      assert_field 'message_content', with: <<~TEXT

        Redmine Admin wrote in message#2:

        > Reply to the first post

      TEXT

    end

    with_text_formatting 'textile' do

      assert_text /This is the very first post/

      # Select the part of the topic message through the entire text of the attachment below it.

      page.execute_script <<-'JS'

        const range = document.createRange();

        const message = document.querySelector('#message_topic_wiki');

        // Select only the text "in the forum" from the text "This is the very first post\nin the forum".

        range.setStartBefore(message.querySelector('p').childNodes[2]);

        range.setEndAfter(message.parentNode.querySelector('.attachments'));

        window.getSelection().addRange(range);

      JS

      within '#content > .contextual' do

        click_link 'Quote'

      end

      assert_field 'message_content', with: <<~TEXT

        Redmine Admin wrote:

        > in the forum

      TEXT

    end

    with_text_formatting 'common_mark' do

      assert_text 'Reply to the first post'

      # Select the entire message, including the subject and headers of messages #2 and #3.

      page.execute_script <<-JS

        const range = document.createRange();

        range.setStartBefore(document.querySelector('#message-2'));

        range.setEndAfter(document.querySelector('#message-3'));

        window.getSelection().addRange(range);

      JS

      within '#message-2' do

        click_link 'Quote'

      end

      assert_field 'message_content', with: <<~TEXT

        Redmine Admin wrote in message#2:

        > Reply to the first post

      TEXT

  end

  private

  def with_text_formatting(format)

    with_settings text_formatting: format do

      log_user('jsmith', 'jsmith')

      visit '/boards/1/topics/1'

      yield

    end

    assert_includes a_tag, %|onclick="#{h "quoteReply('/issues/1/quoted', '#issue_description_wiki', 'common_mark'); return false;"}"|