diff options
Diffstat (limited to 'spec/features/copy_as_gfm_spec.rb')
| -rw-r--r-- | spec/features/copy_as_gfm_spec.rb | 785 |
1 files changed, 471 insertions, 314 deletions
diff --git a/spec/features/copy_as_gfm_spec.rb b/spec/features/copy_as_gfm_spec.rb index 4638812b2d9..55df7e45f79 100644 --- a/spec/features/copy_as_gfm_spec.rb +++ b/spec/features/copy_as_gfm_spec.rb @@ -2,437 +2,594 @@ require 'spec_helper' describe 'Copy as GFM', feature: true, js: true do include GitlabMarkdownHelper + include RepoHelpers include ActionView::Helpers::JavaScriptHelper before do - @feat = MarkdownFeature.new + login_as :admin + end - # `markdown` helper expects a `@project` variable - @project = @feat.project + describe 'Copying rendered GFM' do + before do + @feat = MarkdownFeature.new - visit namespace_project_issue_path(@project.namespace, @project, @feat.issue) - end + # `markdown` helper expects a `@project` variable + @project = @feat.project - # The filters referenced in lib/banzai/pipeline/gfm_pipeline.rb convert GitLab Flavored Markdown (GFM) to HTML. - # The handlers defined in app/assets/javascripts/copy_as_gfm.js.es6 consequently convert that same HTML to GFM. - # To make sure these filters and handlers are properly aligned, this spec tests the GFM-to-HTML-to-GFM cycle - # by verifying (`html_to_gfm(gfm_to_html(gfm)) == gfm`) for a number of examples of GFM for every filter, using the `verify` helper. + visit namespace_project_issue_path(@project.namespace, @project, @feat.issue) + end - # These are all in a single `it` for performance reasons. - it 'works', :aggregate_failures do - verify( - 'nesting', + # The filters referenced in lib/banzai/pipeline/gfm_pipeline.rb convert GitLab Flavored Markdown (GFM) to HTML. + # The handlers defined in app/assets/javascripts/copy_as_gfm.js consequently convert that same HTML to GFM. + # To make sure these filters and handlers are properly aligned, this spec tests the GFM-to-HTML-to-GFM cycle + # by verifying (`html_to_gfm(gfm_to_html(gfm)) == gfm`) for a number of examples of GFM for every filter, using the `verify` helper. - '> 1. [x] **[$`2 + 2`$ {-=-}{+=+} 2^2 ~~:thumbsup:~~](http://google.com)**' - ) + # These are all in a single `it` for performance reasons. + it 'works', :aggregate_failures do + verify( + 'nesting', - verify( - 'a real world example from the gitlab-ce README', + '> 1. [x] **[$`2 + 2`$ {-=-}{+=+} 2^2 ~~:thumbsup:~~](http://google.com)**' + ) - <<-GFM.strip_heredoc - # GitLab + verify( + 'a real world example from the gitlab-ce README', - [](https://gitlab.com/gitlab-org/gitlab-ce/commits/master) - [](https://gitlab-org.gitlab.io/gitlab-ce/coverage-ruby) - [](https://codeclimate.com/github/gitlabhq/gitlabhq) - [](https://bestpractices.coreinfrastructure.org/projects/42) + <<-GFM.strip_heredoc + # GitLab - ## Canonical source + [](https://gitlab.com/gitlab-org/gitlab-ce/commits/master) + [](https://gitlab-org.gitlab.io/gitlab-ce/coverage-ruby) + [](https://codeclimate.com/github/gitlabhq/gitlabhq) + [](https://bestpractices.coreinfrastructure.org/projects/42) - The canonical source of GitLab Community Edition is [hosted on GitLab.com](https://gitlab.com/gitlab-org/gitlab-ce/). + ## Canonical source - ## Open source software to collaborate on code + The canonical source of GitLab Community Edition is [hosted on GitLab.com](https://gitlab.com/gitlab-org/gitlab-ce/). - To see how GitLab looks please see the [features page on our website](https://about.gitlab.com/features/). + ## Open source software to collaborate on code + To see how GitLab looks please see the [features page on our website](https://about.gitlab.com/features/). - - Manage Git repositories with fine grained access controls that keep your code secure - - Perform code reviews and enhance collaboration with merge requests + - Manage Git repositories with fine grained access controls that keep your code secure - - Complete continuous integration (CI) and CD pipelines to builds, test, and deploy your applications + - Perform code reviews and enhance collaboration with merge requests - - Each project can also have an issue tracker, issue board, and a wiki + - Complete continuous integration (CI) and CD pipelines to builds, test, and deploy your applications - - Used by more than 100,000 organizations, GitLab is the most popular solution to manage Git repositories on-premises + - Each project can also have an issue tracker, issue board, and a wiki - - Completely free and open source (MIT Expat license) - GFM - ) + - Used by more than 100,000 organizations, GitLab is the most popular solution to manage Git repositories on-premises - verify( - 'InlineDiffFilter', + - Completely free and open source (MIT Expat license) + GFM + ) - '{-Deleted text-}', - '{+Added text+}' - ) + verify( + 'InlineDiffFilter', - verify( - 'TaskListFilter', + '{-Deleted text-}', + '{+Added text+}' + ) - '- [ ] Unchecked task', - '- [x] Checked task', - '1. [ ] Unchecked numbered task', - '1. [x] Checked numbered task' - ) + verify( + 'TaskListFilter', - verify( - 'ReferenceFilter', + '- [ ] Unchecked task', + '- [x] Checked task', + '1. [ ] Unchecked numbered task', + '1. [x] Checked numbered task' + ) - # issue reference - @feat.issue.to_reference, - # full issue reference - @feat.issue.to_reference(full: true), - # issue URL - namespace_project_issue_url(@project.namespace, @project, @feat.issue), - # issue URL with note anchor - namespace_project_issue_url(@project.namespace, @project, @feat.issue, anchor: 'note_123'), - # issue link - "[Issue](#{namespace_project_issue_url(@project.namespace, @project, @feat.issue)})", - # issue link with note anchor - "[Issue](#{namespace_project_issue_url(@project.namespace, @project, @feat.issue, anchor: 'note_123')})", - ) + verify( + 'ReferenceFilter', - verify( - 'AutolinkFilter', + # issue reference + @feat.issue.to_reference, + # full issue reference + @feat.issue.to_reference(full: true), + # issue URL + namespace_project_issue_url(@project.namespace, @project, @feat.issue), + # issue URL with note anchor + namespace_project_issue_url(@project.namespace, @project, @feat.issue, anchor: 'note_123'), + # issue link + "[Issue](#{namespace_project_issue_url(@project.namespace, @project, @feat.issue)})", + # issue link with note anchor + "[Issue](#{namespace_project_issue_url(@project.namespace, @project, @feat.issue, anchor: 'note_123')})", + ) - 'https://example.com' - ) + verify( + 'AutolinkFilter', - verify( - 'TableOfContentsFilter', + 'https://example.com' + ) - '[[_TOC_]]' - ) + verify( + 'TableOfContentsFilter', - verify( - 'EmojiFilter', + '[[_TOC_]]' + ) - ':thumbsup:' - ) + verify( + 'EmojiFilter', - verify( - 'ImageLinkFilter', - - '' - ) + ':thumbsup:' + ) - verify( - 'VideoLinkFilter', + verify( + 'ImageLinkFilter', + + '' + ) - '' - ) + verify( + 'VideoLinkFilter', - verify( - 'MathFilter: math as converted from GFM to HTML', + '' + ) - '$`c = \pm\sqrt{a^2 + b^2}`$', + verify( + 'MathFilter: math as converted from GFM to HTML', - # math block - <<-GFM.strip_heredoc - ```math - c = \pm\sqrt{a^2 + b^2} - ``` - GFM - ) + '$`c = \pm\sqrt{a^2 + b^2}`$', - aggregate_failures('MathFilter: math as transformed from HTML to KaTeX') do - gfm = '$`c = \pm\sqrt{a^2 + b^2}`$' + # math block + <<-GFM.strip_heredoc + ```math + c = \pm\sqrt{a^2 + b^2} + ``` + GFM + ) - html = <<-HTML.strip_heredoc - <span class="katex"> - <span class="katex-mathml"> - <math> - <semantics> - <mrow> - <mi>c</mi> - <mo>=</mo> - <mo>±</mo> - <msqrt> - <mrow> - <msup> - <mi>a</mi> - <mn>2</mn> - </msup> - <mo>+</mo> - <msup> - <mi>b</mi> - <mn>2</mn> - </msup> - </mrow> - </msqrt> - </mrow> - <annotation encoding="application/x-tex">c = \\pm\\sqrt{a^2 + b^2}</annotation> - </semantics> - </math> - </span> - <span class="katex-html" aria-hidden="true"> - <span class="strut" style="height: 0.913389em;"></span> - <span class="strut bottom" style="height: 1.04em; vertical-align: -0.126611em;"></span> - <span class="base textstyle uncramped"> - <span class="mord mathit">c</span> - <span class="mrel">=</span> - <span class="mord">±</span> - <span class="sqrt mord"><span class="sqrt-sign" style="top: -0.073389em;"> - <span class="style-wrap reset-textstyle textstyle uncramped">√</span> - </span> - <span class="vlist"> - <span class="" style="top: 0em;"> - <span class="fontsize-ensurer reset-size5 size5"> - <span class="" style="font-size: 1em;"></span> - </span> - <span class="mord textstyle cramped"> - <span class="mord"> - <span class="mord mathit">a</span> - <span class="msupsub"> - <span class="vlist"> - <span class="" style="top: -0.289em; margin-right: 0.05em;"> - <span class="fontsize-ensurer reset-size5 size5"> - <span class="" style="font-size: 0em;"></span> - </span> - <span class="reset-textstyle scriptstyle cramped"> - <span class="mord mathrm">2</span> + aggregate_failures('MathFilter: math as transformed from HTML to KaTeX') do + gfm = '$`c = \pm\sqrt{a^2 + b^2}`$' + + html = <<-HTML.strip_heredoc + <span class="katex"> + <span class="katex-mathml"> + <math> + <semantics> + <mrow> + <mi>c</mi> + <mo>=</mo> + <mo>±</mo> + <msqrt> + <mrow> + <msup> + <mi>a</mi> + <mn>2</mn> + </msup> + <mo>+</mo> + <msup> + <mi>b</mi> + <mn>2</mn> + </msup> + </mrow> + </msqrt> + </mrow> + <annotation encoding="application/x-tex">c = \\pm\\sqrt{a^2 + b^2}</annotation> + </semantics> + </math> + </span> + <span class="katex-html" aria-hidden="true"> + <span class="strut" style="height: 0.913389em;"></span> + <span class="strut bottom" style="height: 1.04em; vertical-align: -0.126611em;"></span> + <span class="base textstyle uncramped"> + <span class="mord mathit">c</span> + <span class="mrel">=</span> + <span class="mord">±</span> + <span class="sqrt mord"><span class="sqrt-sign" style="top: -0.073389em;"> + <span class="style-wrap reset-textstyle textstyle uncramped">√</span> + </span> + <span class="vlist"> + <span class="" style="top: 0em;"> + <span class="fontsize-ensurer reset-size5 size5"> + <span class="" style="font-size: 1em;"></span> + </span> + <span class="mord textstyle cramped"> + <span class="mord"> + <span class="mord mathit">a</span> + <span class="msupsub"> + <span class="vlist"> + <span class="" style="top: -0.289em; margin-right: 0.05em;"> + <span class="fontsize-ensurer reset-size5 size5"> + <span class="" style="font-size: 0em;"></span> + </span> + <span class="reset-textstyle scriptstyle cramped"> + <span class="mord mathrm">2</span> + </span> </span> + <span class="baseline-fix"> + <span class="fontsize-ensurer reset-size5 size5"> + <span class="" style="font-size: 0em;"></span> + </span> + </span> </span> - <span class="baseline-fix"> - <span class="fontsize-ensurer reset-size5 size5"> - <span class="" style="font-size: 0em;"></span> - </span> - </span> </span> </span> - </span> - <span class="mbin">+</span> - <span class="mord"> - <span class="mord mathit">b</span> - <span class="msupsub"> - <span class="vlist"> - <span class="" style="top: -0.289em; margin-right: 0.05em;"> - <span class="fontsize-ensurer reset-size5 size5"> - <span class="" style="font-size: 0em;"></span> - </span> - <span class="reset-textstyle scriptstyle cramped"> - <span class="mord mathrm">2</span> + <span class="mbin">+</span> + <span class="mord"> + <span class="mord mathit">b</span> + <span class="msupsub"> + <span class="vlist"> + <span class="" style="top: -0.289em; margin-right: 0.05em;"> + <span class="fontsize-ensurer reset-size5 size5"> + <span class="" style="font-size: 0em;"></span> + </span> + <span class="reset-textstyle scriptstyle cramped"> + <span class="mord mathrm">2</span> + </span> </span> + <span class="baseline-fix"> + <span class="fontsize-ensurer reset-size5 size5"> + <span class="" style="font-size: 0em;"></span> + </span> + </span> </span> - <span class="baseline-fix"> - <span class="fontsize-ensurer reset-size5 size5"> - <span class="" style="font-size: 0em;"></span> - </span> - </span> </span> </span> </span> </span> - </span> - <span class="" style="top: -0.833389em;"> - <span class="fontsize-ensurer reset-size5 size5"> - <span class="" style="font-size: 1em;"></span> + <span class="" style="top: -0.833389em;"> + <span class="fontsize-ensurer reset-size5 size5"> + <span class="" style="font-size: 1em;"></span> + </span> + <span class="reset-textstyle textstyle uncramped sqrt-line"></span> </span> - <span class="reset-textstyle textstyle uncramped sqrt-line"></span> + <span class="baseline-fix"> + <span class="fontsize-ensurer reset-size5 size5"> + <span class="" style="font-size: 1em;"></span> + </span> + </span> </span> - <span class="baseline-fix"> - <span class="fontsize-ensurer reset-size5 size5"> - <span class="" style="font-size: 1em;"></span> - </span> - </span> </span> </span> </span> </span> - </span> - HTML + HTML - output_gfm = html_to_gfm(html) - expect(output_gfm.strip).to eq(gfm.strip) - end + output_gfm = html_to_gfm(html) + expect(output_gfm.strip).to eq(gfm.strip) + end - verify( - 'SanitizationFilter', + verify( + 'SanitizationFilter', - <<-GFM.strip_heredoc - <a name="named-anchor"></a> + <<-GFM.strip_heredoc + <a name="named-anchor"></a> - <sub>sub</sub> + <sub>sub</sub> - <dl> - <dt>dt</dt> - <dd>dd</dd> - </dl> + <dl> + <dt>dt</dt> + <dd>dd</dd> + </dl> - <kbd>kbd</kbd> + <kbd>kbd</kbd> - <q>q</q> + <q>q</q> - <samp>samp</samp> + <samp>samp</samp> - <var>var</var> + <var>var</var> - <ruby>ruby</ruby> + <ruby>ruby</ruby> - <rt>rt</rt> + <rt>rt</rt> - <rp>rp</rp> + <rp>rp</rp> - <abbr>abbr</abbr> + <abbr>abbr</abbr> - <summary>summary</summary> + <summary>summary</summary> - <details>details</details> - GFM - ) + <details>details</details> + GFM + ) - verify( - 'SanitizationFilter', + verify( + 'SanitizationFilter', - <<-GFM.strip_heredoc, - ``` - Plain text - ``` - GFM + <<-GFM.strip_heredoc, + ``` + Plain text + ``` + GFM - <<-GFM.strip_heredoc, - ```ruby - def foo - bar - end - ``` - GFM + <<-GFM.strip_heredoc, + ```ruby + def foo + bar + end + ``` + GFM + + <<-GFM.strip_heredoc + Foo + + This is an example of GFM - <<-GFM.strip_heredoc - Foo + ```js + Code goes here + ``` + GFM + ) - This is an example of GFM + verify( + 'MarkdownFilter', - ```js - Code goes here - ``` - GFM - ) + "Line with two spaces at the end \nto insert a linebreak", - verify( - 'MarkdownFilter', + '`code`', + '`` code with ` ticks ``', - "Line with two spaces at the end \nto insert a linebreak", + '> Quote', - '`code`', - '`` code with ` ticks ``', + # multiline quote + <<-GFM.strip_heredoc, + > Multiline + > Quote + > + > With multiple paragraphs + GFM - '> Quote', + '', - # multiline quote - <<-GFM.strip_heredoc, - > Multiline - > Quote - > - > With multiple paragraphs - GFM + '# Heading with no anchor link', - '', + '[Link](https://example.com)', - '# Heading with no anchor link', + '- List item', - '[Link](https://example.com)', + # multiline list item + <<-GFM.strip_heredoc, + - Multiline + List item + GFM - '- List item', + # nested lists + <<-GFM.strip_heredoc, + - Nested - # multiline list item - <<-GFM.strip_heredoc, - - Multiline - List item - GFM - # nested lists - <<-GFM.strip_heredoc, - - Nested + - Lists + GFM + # list with blockquote + <<-GFM.strip_heredoc, + - List - - Lists - GFM + > Blockquote + GFM - # list with blockquote - <<-GFM.strip_heredoc, - - List + '1. Numbered list item', - > Blockquote - GFM + # multiline numbered list item + <<-GFM.strip_heredoc, + 1. Multiline + Numbered list item + GFM - '1. Numbered list item', + # nested numbered list + <<-GFM.strip_heredoc, + 1. Nested - # multiline numbered list item - <<-GFM.strip_heredoc, - 1. Multiline - Numbered list item - GFM - # nested numbered list - <<-GFM.strip_heredoc, - 1. Nested + 1. Numbered lists + GFM + '# Heading', + '## Heading', + '### Heading', + '#### Heading', + '##### Heading', + '###### Heading', - 1. Numbered lists - GFM + '**Bold**', - '# Heading', - '## Heading', - '### Heading', - '#### Heading', - '##### Heading', - '###### Heading', + '_Italics_', - '**Bold**', + '~~Strikethrough~~', - '_Italics_', + '2^2', - '~~Strikethrough~~', + '-----', - '2^2', + # table + <<-GFM.strip_heredoc, + | Centered | Right | Left | + |:--------:|------:|------| + | Foo | Bar | **Baz** | + | Foo | Bar | **Baz** | + GFM - '-----', + # table with empty heading + <<-GFM.strip_heredoc, + | | x | y | + |---|---|---| + | a | 1 | 0 | + | b | 0 | 1 | + GFM + ) + end + + alias_method :gfm_to_html, :markdown - # table - <<-GFM.strip_heredoc, - | Centered | Right | Left | - |:--------:|------:|------| - | Foo | Bar | **Baz** | - | Foo | Bar | **Baz** | - GFM + def verify(label, *gfms) + aggregate_failures(label) do + gfms.each do |gfm| + html = gfm_to_html(gfm) + output_gfm = html_to_gfm(html) + expect(output_gfm.strip).to eq(gfm.strip) + end + end + end - # table with empty heading - <<-GFM.strip_heredoc, - | | x | y | - |---|---|---| - | a | 1 | 0 | - | b | 0 | 1 | - GFM - ) + # Fake a `current_user` helper + def current_user + @feat.user + end end - alias_method :gfm_to_html, :markdown + describe 'Copying code' do + let(:project) { create(:project) } + + context 'from a diff' do + before do + visit namespace_project_commit_path(project.namespace, project, sample_commit.id) + end + + context 'selecting one word of text' do + it 'copies as inline code' do + verify( + '[id="2f6fcd96b88b36ce98c38da085c795a27d92a3dd_10_9"] .line .no', - def html_to_gfm(html) + '`RuntimeError`' + ) + end + end + + context 'selecting one line of text' do + it 'copies as inline code' do + verify( + '[id="2f6fcd96b88b36ce98c38da085c795a27d92a3dd_10_9"] .line', + + '`raise RuntimeError, "System commands must be given as an array of strings"`' + ) + end + end + + context 'selecting multiple lines of text' do + it 'copies as a code block' do + verify( + '[id="2f6fcd96b88b36ce98c38da085c795a27d92a3dd_10_9"], [id="2f6fcd96b88b36ce98c38da085c795a27d92a3dd_10_10"]', + + <<-GFM.strip_heredoc, + ```ruby + raise RuntimeError, "System commands must be given as an array of strings" + end + ``` + GFM + ) + end + end + end + + context 'from a blob' do + before do + visit namespace_project_blob_path(project.namespace, project, File.join('master', 'files/ruby/popen.rb')) + end + + context 'selecting one word of text' do + it 'copies as inline code' do + verify( + '.line[id="LC9"] .no', + + '`RuntimeError`' + ) + end + end + + context 'selecting one line of text' do + it 'copies as inline code' do + verify( + '.line[id="LC9"]', + + '`raise RuntimeError, "System commands must be given as an array of strings"`' + ) + end + end + + context 'selecting multiple lines of text' do + it 'copies as a code block' do + verify( + '.line[id="LC9"], .line[id="LC10"]', + + <<-GFM.strip_heredoc, + ```ruby + raise RuntimeError, "System commands must be given as an array of strings" + end + ``` + GFM + ) + end + end + end + + context 'from a GFM code block' do + before do + visit namespace_project_blob_path(project.namespace, project, File.join('markdown', 'doc/api/users.md')) + end + + context 'selecting one word of text' do + it 'copies as inline code' do + verify( + '.line[id="LC27"] .s2', + + '`"bio"`' + ) + end + end + + context 'selecting one line of text' do + it 'copies as inline code' do + verify( + '.line[id="LC27"]', + + '`"bio": null,`' + ) + end + end + + context 'selecting multiple lines of text' do + it 'copies as a code block with the correct language' do + verify( + '.line[id="LC27"], .line[id="LC28"]', + + <<-GFM.strip_heredoc, + ```json + "bio": null, + "skype": "", + ``` + GFM + ) + end + end + end + + def verify(selector, gfm) + html = html_for_selector(selector) + output_gfm = html_to_gfm(html, 'transformCodeSelection') + expect(output_gfm.strip).to eq(gfm.strip) + end + end + + def html_for_selector(selector) + js = <<-JS.strip_heredoc + (function(selector) { + var els = document.querySelectorAll(selector); + var htmls = _.map(els, function(el) { return el.outerHTML; }); + return htmls.join("\\n"); + })("#{escape_javascript(selector)}") + JS + page.evaluate_script(js) + end + + def html_to_gfm(html, transformer = 'transformGFMSelection') js = <<-JS.strip_heredoc (function(html) { + var transformer = window.gl.CopyAsGFM[#{transformer.inspect}]; + var node = document.createElement('div'); node.innerHTML = html; + + node = transformer(node); + if (!node) return null; + return window.gl.CopyAsGFM.nodeToGFM(node); })("#{escape_javascript(html)}") JS page.evaluate_script(js) end - - def verify(label, *gfms) - aggregate_failures(label) do - gfms.each do |gfm| - html = gfm_to_html(gfm) - output_gfm = html_to_gfm(html) - expect(output_gfm.strip).to eq(gfm.strip) - end - end - end - - # Fake a `current_user` helper - def current_user - @feat.user - end end |