Commit 394ab119 authored by Jan Provaznik's avatar Jan Provaznik

Merge branch '38144-replace-labels-in-haml-with-gitlab-ui-css' into 'master'

Replace labels in HAML with gitlab-ui CSS

See merge request gitlab-org/gitlab!21377
parents b9ca78b3 b28414e8
import $ from 'jquery';
import Sortable from 'sortablejs';
import Vue from 'vue';
import { GlButtonGroup, GlButton, GlTooltip } from '@gitlab/ui';
import { GlButtonGroup, GlButton, GlLabel, GlTooltip } from '@gitlab/ui';
import isWipLimitsOn from 'ee_else_ce/boards/mixins/is_wip_limits';
import { s__, __, sprintf } from '~/locale';
import Icon from '~/vue_shared/components/icon.vue';
......@@ -14,6 +14,7 @@ import IssueCount from './issue_count.vue';
import boardsStore from '../stores/boards_store';
import { getBoardSortableDefaultOptions, sortableEnd } from '../mixins/sortable_default_options';
import { ListType } from '../constants';
import { isScopedLabel } from '~/lib/utils/common_utils';
export default Vue.extend({
components: {
......@@ -24,6 +25,7 @@ export default Vue.extend({
GlButtonGroup,
IssueCount,
GlButton,
GlLabel,
GlTooltip,
},
directives: {
......@@ -95,6 +97,9 @@ export default Vue.extend({
// eslint-disable-next-line @gitlab/i18n/no-non-i18n-strings
return `boards.${this.boardId}.${this.list.type}.${this.list.id}`;
},
helpLink() {
return boardsStore.scopedLabels.helpLink;
},
},
watch: {
filter: {
......@@ -145,6 +150,10 @@ export default Vue.extend({
}
},
methods: {
showScopedLabels(label) {
return boardsStore.scopedLabels.enabled && isScopedLabel(label);
},
showNewIssueForm() {
this.$refs['board-list'].showIssueForm = !this.$refs['board-list'].showIssueForm;
},
......
......@@ -2,6 +2,7 @@
import $ from 'jquery';
import Vue from 'vue';
import { GlLabel } from '@gitlab/ui';
import Flash from '~/flash';
import { sprintf, __ } from '~/locale';
import Sidebar from '~/right_sidebar';
......@@ -22,6 +23,7 @@ export default Vue.extend({
components: {
AssigneeTitle,
Assignees,
GlLabel,
SidebarEpicsSelect: () =>
import('ee_component/sidebar/components/sidebar_item_epics_select.vue'),
RemoveBtn,
......@@ -67,6 +69,9 @@ export default Vue.extend({
selectedLabels() {
return this.hasLabels ? this.issue.labels.map(l => l.title).join(',') : '';
},
helpLink() {
return boardsStore.scopedLabels.helpLink;
},
},
watch: {
detail: {
......@@ -147,8 +152,5 @@ export default Vue.extend({
showScopedLabels(label) {
return boardsStore.scopedLabels.enabled && isScopedLabel(label);
},
helpLink() {
return boardsStore.scopedLabels.helpLink;
},
},
});
......@@ -13,16 +13,14 @@
.page-title,
.modal-title {
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
.modal-title-with-label span {
vertical-align: middle;
display: inline-block;
}
.color-label {
font-size: $gl-font-size;
padding: $gl-vert-padding $label-padding-modal;
vertical-align: middle;
}
}
.modal-title {
......
......@@ -86,14 +86,19 @@
}
.issuable-show-labels {
a {
.gl-label {
margin-bottom: 5px;
margin-right: 5px;
}
a {
display: inline-block;
.color-label {
padding: 4px $grid-size;
border-radius: $label-border-radius;
margin-right: 4px;
margin-bottom: 4px;
}
&:hover .color-label {
......@@ -159,9 +164,25 @@
.avatar {
border-color: rgba($gray-normal, 0.2);
}
}
}
a.gl-label-icon {
color: $gray-500;
}
.gl-label .gl-label-link:hover {
text-decoration: none;
color: inherit;
.gl-label-text:last-of-type {
text-decoration: underline;
}
}
.gl-label .gl-label-icon:hover {
text-decoration: none;
color: $gray-500;
}
.btn-link {
......@@ -800,11 +821,23 @@
a {
color: $gl-text-color;
}
.fa {
color: $gl-text-color-secondary;
.gl-label-link {
color: inherit;
&:hover {
text-decoration: none;
.gl-label-text:last-of-type {
text-decoration: underline;
}
}
}
.gl-label-icon {
color: $gray-500;
}
}
@media(max-width: map-get($grid-breakpoints, lg)-1) {
......
......@@ -127,6 +127,11 @@
.color-label {
padding: $gl-padding-4 $grid-size;
}
.prepend-description-left {
vertical-align: top;
line-height: 24px;
}
}
.prioritized-labels {
......@@ -305,10 +310,13 @@
width: 150px;
flex-shrink: 0;
.badge {
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
.scoped-label-wrapper,
.gl-label {
line-height: $gl-line-height;
}
.gl-label-scoped .gl-label-text:last-of-type {
padding-right: 22px;
}
}
......@@ -445,10 +453,19 @@
}
}
.gl-label-scoped {
box-shadow: 0 0 0 2px currentColor inset;
&.gl-label-sm {
box-shadow: 0 0 0 1px inset;
}
}
// Label inside title of Delete Label Modal
.modal-header .page-title {
.scoped-label-wrapper {
.scoped-label {
.scoped-label,
.gl-label-icon {
line-height: 20px;
}
......
......@@ -59,9 +59,19 @@ $status-box-line-height: 26px;
}
.issuable-row {
span a {
color: $gl-text-color;
word-wrap: break-word;
span {
a {
color: $gl-text-color;
word-wrap: break-word;
}
.gl-label-link {
color: inherit;
}
.gl-label-icon {
color: $gray-500;
}
}
}
......
......@@ -283,7 +283,7 @@ $note-form-margin-left: 72px;
text-transform: lowercase;
}
a {
a:not(.gl-link) {
color: $blue-600;
}
......@@ -671,6 +671,16 @@ $note-form-margin-left: 72px;
a:hover {
text-decoration: underline;
}
.gl-label-link:hover,
.gl-label-icon:hover {
text-decoration: none;
color: inherit;
.gl-label-text:last-of-type {
text-decoration: underline;
}
}
}
/**
......
......@@ -36,37 +36,42 @@ module LabelsHelper
# link_to_label(label) { "My Custom Label Text" }
#
# Returns a String
def link_to_label(label, type: :issue, tooltip: true, css_class: nil, &block)
def link_to_label(label, type: :issue, tooltip: true, small: false, &block)
link = label.filter_path(type: type)
if block_given?
link_to link, class: css_class, &block
link_to link, &block
else
render_label(label, tooltip: tooltip, link: link, css: css_class)
render_label(label, link: link, tooltip: tooltip, small: small)
end
end
def render_label(label, tooltip: true, link: nil, css: nil, dataset: nil)
# if scoped label is used then EE wraps label tag with scoped label
# doc link
html = render_colored_label(label, tooltip: tooltip)
html = link_to(html, link, class: css, data: dataset) if link
def render_label(label, link: nil, tooltip: true, dataset: nil, small: false)
html = render_colored_label(label)
html
if link
title = label_tooltip_title(label) if tooltip
html = render_label_link(html, link: link, title: title, dataset: dataset)
end
wrap_label_html(html, small: small, label: label)
end
def render_colored_label(label, label_suffix: '', tooltip: true, title: nil)
text_color = text_color_for_bg(label.color)
title ||= tooltip ? label_tooltip_title(label) : label.name
def render_colored_label(label, suffix: '')
render_label_text(
label.name,
suffix: suffix,
css_class: text_color_class_for_bg(label.color),
bg_color: label.color
)
end
# Intentionally not using content_tag here so that this method can be called
# by LabelReferenceFilter
span = %(<span class="badge color-label #{"has-tooltip" if tooltip}" ) +
%(data-html="true" style="background-color: #{label.color}; color: #{text_color}" ) +
%(title="#{ERB::Util.html_escape_once(title)}" data-container="body">) +
%(#{ERB::Util.html_escape_once(label.name)}#{label_suffix}</span>)
# We need the `label` argument here for EE
def wrap_label_html(label_html, small:, label:)
wrapper_classes = %w(gl-label)
wrapper_classes << 'gl-label-sm' if small
span.html_safe
%(<span class="#{wrapper_classes.join(' ')}">#{label_html}</span>).html_safe
end
def label_tooltip_title(label)
......@@ -109,6 +114,20 @@ module LabelsHelper
end
end
def text_color_class_for_bg(bg_color)
if bg_color.length == 4
r, g, b = bg_color[1, 4].scan(/./).map { |v| (v * 2).hex }
else
r, g, b = bg_color[1, 7].scan(/.{2}/).map(&:hex)
end
if (r + g + b) > 500
'gl-label-text-dark'
else
'gl-label-text-light'
end
end
def text_color_for_bg(bg_color)
if bg_color.length == 4
r, g, b = bg_color[1, 4].scan(/./).map { |v| (v * 2).hex }
......@@ -246,6 +265,31 @@ module LabelsHelper
def issuable_types
['issues', 'merge requests']
end
private
def render_label_link(label_html, link:, title:, dataset:)
classes = %w(gl-link gl-label-link)
dataset ||= {}
if title.present?
classes << 'has-tooltip'
dataset.merge!(html: true, title: title)
end
link_to(label_html, link, class: classes.join(' '), data: dataset)
end
def render_label_text(name, suffix: '', css_class: nil, bg_color: nil)
<<~HTML.chomp.html_safe
<span
class="gl-label-text #{css_class}"
data-container="body"
data-html="true"
#{"style=\"background-color: #{bg_color}\"" if bg_color}
>#{ERB::Util.html_escape_once(name)}#{suffix}</span>
HTML
end
end
LabelsHelper.prepend_if_ee('EE::LabelsHelper')
......@@ -38,7 +38,7 @@
- if issue.labels.any?
&nbsp;
- presented_labels_sorted_by_title(issue.labels, issue.project).each do |label|
= link_to_label(label, css_class: 'label-link')
= link_to_label(label, small: true)
= render_if_exists "projects/issues/issue_weight", issue: issue
......
......@@ -35,7 +35,7 @@
- if merge_request.labels.any?
&nbsp;
- presented_labels_sorted_by_title(merge_request.labels, merge_request.project).each do |label|
= link_to_label(label, type: :merge_request, css_class: 'label-link')
= link_to_label(label, type: :merge_request, small: true)
.issuable-meta
%ul.controls.d-flex.align-items-end
......
......@@ -2,7 +2,7 @@
.modal-dialog
.modal-content
.modal-header
%h3.page-title Delete #{render_label(label, tooltip: false)} ?
%h3.page-title Delete label: #{label.name} ?
%button.close{ type: "button", "data-dismiss": "modal", "aria-label" => _('Close') }
%span{ "aria-hidden": true } &times;
......
......@@ -29,11 +29,14 @@
":title" => '(list.assignee && list.assignee.username || "")' }
@{{ list.assignee.username }}
%span.has-tooltip.badge.color-label.title.d-inline-block.mw-100.text-truncate.align-middle{ "v-if": "list.type === \"label\"",
":title" => '(list.label ? list.label.description : "")',
data: { container: "body", placement: "bottom" },
":style" => "{ backgroundColor: (list.label && list.label.color ? list.label.color : null), color: (list.label && list.label.textColor ? list.label.textColor : \"#2e2e2e\") }" }
{{ list.title }}
%gl-label{ "v-if" => " list.type === \"label\"",
":background-color" => "list.label.color",
":title" => "list.label.title",
":description" => "list.label.description",
"tooltipPlacement" => "bottom",
":size" => '(!list.isExpanded ? "sm" : "")',
":scoped" => "showScopedLabels(list.label)",
":scoped-labels-documentation-link" => "helpLink" }
- if can?(current_user, :admin_list, current_board_parent)
%board-delete{ "inline-template" => true,
......
......@@ -8,15 +8,12 @@
%span.no-value{ "v-if" => "issue.labels && issue.labels.length === 0" }
= _("None")
%span{ "v-for" => "label in issue.labels" }
%span.d-inline-block.position-relative.scoped-label-wrapper{ "v-if" => "showScopedLabels(label)" }
%a{ href: '#' }
%span.badge.color-label.label{ ":style" => "{ backgroundColor: label.color, color: label.textColor }" }
{{ label.title }}
%a.label.scoped-label{ ":href" => "helpLink()" }
%i.fa.fa-question-circle{ ":style" => "{ backgroundColor: label.color, color: label.textColor }" }
%a{ href: "#", "v-else" => true }
.badge.color-label.has-tooltip{ ":style" => "{ backgroundColor: label.color, color: label.textColor }" }
{{ label.title }}
%gl-label{ ":key" => "label.id",
":background-color" => "label.color",
":title" => "label.title",
":description" => "label.description",
":scoped" => "showScopedLabels(label)",
":scoped-labels-documentation-link" => "helpLink" }
- if can_admin_issue?
.selectbox
......
......@@ -21,7 +21,7 @@
%span.issuable-number= issuable.to_reference
- labels.each do |label|
= render_label(label.present(issuable_subject: project), link: polymorphic_path(issuable_type_args, { milestone_title: @milestone.title, label_name: label.title, state: 'all' }))
= render_label(label.present(issuable_subject: project), link: polymorphic_path(issuable_type_args, { milestone_title: @milestone.title, label_name: label.title, state: 'all' }), small: true)
%span.assignee-icon
- assignees.each do |assignee|
......
......@@ -3,11 +3,9 @@
- options = { milestone_title: @milestone.title, label_name: label.title }
%li.no-border
%span.label-row
%span.label-name
= render_label(label, tooltip: false, link: milestones_label_path(options))
%span.prepend-description-left
= markdown_field(label, :description)
= render_label(label, tooltip: false, link: milestones_label_path(options))
%span.prepend-description-left
= markdown_field(label, :description)
.float-right.d-none.d-lg-block.d-xl-block
= link_to milestones_label_path(options.merge(state: 'opened')), class: 'btn btn-transparent btn-action' do
......
---
title: New styles for scoped labels
merge_request: 21377
author:
type: changed
......@@ -8,15 +8,32 @@ module EE
singleton_class.prepend self
end
def render_label(label, tooltip: true, link: nil, css: nil, dataset: nil)
content = super
content = scoped_label_wrapper(content, label) if label.scoped_label?
content
def render_colored_label(label, suffix: '')
return super unless label.scoped_label?
scope_name, label_name = label.name.split(Label::SCOPED_LABEL_SEPARATOR)
render_label_text(
scope_name,
css_class: text_color_class_for_bg(label.color),
bg_color: label.color
) + render_label_text(
label_name,
suffix: suffix
)
end
def scoped_label_wrapper(link, label)
%(<span class="d-inline-block position-relative scoped-label-wrapper">#{link}#{scoped_labels_doc_link(label)}</span>).html_safe
def wrap_label_html(label_html, small:, label:)
return super unless label.scoped_label?
wrapper_classes = %w(gl-label gl-label-scoped)
wrapper_classes << 'gl-label-sm' if small
<<~HTML.chomp.html_safe
<span class="d-inline-block position-relative scoped-label-wrapper">
<span class="#{wrapper_classes.join(' ')}" style="color: #{label.color}">#{label_html + scoped_labels_doc_link}</span>
</span>
HTML
end
def label_tooltip_title(label)
......@@ -57,12 +74,10 @@ module EE
private
def scoped_labels_doc_link(label)
text_color = text_color_for_bg(label.color)
content = %(<i class="fa fa-question-circle" style="background-color: #{label.color}; color: #{text_color}"></i>)
help_url = ::Gitlab::Routing.url_helpers.help_page_url('user/project/labels.md', anchor: 'scoped-labels')
def scoped_labels_doc_link
help_url = ::Gitlab::Routing.url_helpers.help_page_path('user/project/labels.md', anchor: 'scoped-labels')
%(<a href="#{help_url}" class="label scoped-label" target="_blank" rel="noopener">#{content}</a>)
%(<a href="#{help_url}" class="gl-link gl-label-icon" target="_blank" rel="noopener"><i class="fa fa-question-circle"></i></a>).html_safe
end
end
end
......@@ -4,7 +4,8 @@ module EE
module Label
extend ActiveSupport::Concern
SCOPED_LABEL_PATTERN = /^.*::/.freeze
SCOPED_LABEL_SEPARATOR = '::'
SCOPED_LABEL_PATTERN = /^.*#{SCOPED_LABEL_SEPARATOR}/.freeze
def scoped_label?
SCOPED_LABEL_PATTERN.match?(name)
......
......@@ -23,7 +23,7 @@
- if epic.labels.any?
&nbsp;
- epic.labels.each do |label|
= render_label(label.present(issuable_subject: @group), tooltip: true, link: group_epics_path(@group, label_name:[label.name]), css: 'label-link')
= render_label(label.present(issuable_subject: @group), tooltip: true, link: group_epics_path(@group, label_name:[label.name]), small: true)
.issuable-meta
%ul.controls
......
# frozen_string_literal: true
module EE
module Banzai
module Filter
module LabelReferenceFilter
extend ::Gitlab::Utils::Override
override :wrap_link
def wrap_link(link, label)
content = super
parent = project || group
if label.scoped_label? && parent && parent.feature_available?(:scoped_labels)
presenter = label.present(issuable_parent: parent)
content = ::LabelsHelper.scoped_label_wrapper(content, presenter)
end
content
end
def tooltip_title(label)
::LabelsHelper.label_tooltip_title(label)
end
end
end
end
end
......@@ -263,6 +263,9 @@ describe 'Issue Boards', :js do
end
it 'removes existing scoped label' do
scoped1 = scoped_label_1.title.split(Label::SCOPED_LABEL_SEPARATOR)
scoped2 = scoped_label_2.title.split(Label::SCOPED_LABEL_SEPARATOR)
click_card(card1)
page.within('.labels') do
......@@ -281,9 +284,10 @@ describe 'Issue Boards', :js do
find('.dropdown-menu-close-icon').click
page.within('.value') do
expect(page).to have_selector('.scoped-label-wrapper', count: 1)
expect(page).not_to have_content(scoped_label_1.title)
expect(page).to have_content(scoped_label_2.title)
expect(page).to have_selector('.gl-label-scoped', count: 1)
expect(page).not_to have_content(scoped1.last)
expect(page).to have_content(scoped2.first)
expect(page).to have_content(scoped2.last)
end
end
......
......@@ -14,11 +14,13 @@ describe LabelsHelper do
end
it 'includes link to scoped labels documentation' do
expect(render_label(scoped_label)).to match(%r(<span.+>#{scoped_label.name}</span><a.+>.*question-circle.*</a>))
scope, name = scoped_label.title.split(Label::SCOPED_LABEL_SEPARATOR)
expect(render_label(scoped_label)).to match(%r(<span.+>#{scope}</span><span.+>#{name}</span><a.+>.*question-circle.*</a>)m)
end
it 'does not include link to scoped label documentation for common labels' do
expect(render_label(label)).to match(%r(<span.+>#{label.name}</span>$))
expect(render_label(label)).to match(%r(<span.+><span.+>#{label.name}</span></span>$)m)
end
end
......@@ -28,7 +30,7 @@ describe LabelsHelper do
end
it 'does not include link to scoped documentation' do
expect(render_label(scoped_label)).to match(%r(<span.+>#{scoped_label.name}</span>$))
expect(render_label(scoped_label)).to match(%r(<span.+><span.+>#{scoped_label.name}</span></span>$)m)
end
end
end
......
......@@ -16,14 +16,15 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'includes link to scoped documentation' do
doc = reference_filter("See #{scoped_label.to_reference}")
scope, name = scoped_label.name.split(Label::SCOPED_LABEL_SEPARATOR)
expect(doc.to_html).to match(%r(<a.+><span.+>#{scoped_label.name}</span></a><a.+>.*question-circle.*</a>))
expect(doc.to_html).to match(%r(<span.+><a.+><span.+>#{scope}</span><span.+>#{name}</span></a><a.+>.*question-circle.*</a></span>))
end
it 'does not include link to scoped documentation for common labels' do
doc = reference_filter("See #{label.to_reference}")
expect(doc.to_html).to match(%r(<a.+><span.+>#{label.name}</span></a>$))
expect(doc.to_html).to match(%r(<span.+><a.+><span.+>#{label.name}</span></a></span>$))
end
end
......@@ -32,10 +33,10 @@ describe Banzai::Filter::LabelReferenceFilter do
stub_licensed_features(scoped_labels: false)
end
it 'does not include link to scoped labels documentation' do
it 'renders label as a common label' do
doc = reference_filter("See #{scoped_label.to_reference}")
expect(doc.to_html).to match(%r(<a.+><span.+>#{scoped_label.name}</span></a>$))
expect(doc.to_html).to match(%r(<span.+><a.+><span.+>#{scoped_label.name}</span></a></span>$))
end
end
end
......@@ -93,23 +93,26 @@ module Banzai
end
presenter = object.present(issuable_subject: parent)
LabelsHelper.render_colored_label(presenter, label_suffix: label_suffix, title: tooltip_title(presenter))
LabelsHelper.render_colored_label(presenter, suffix: label_suffix)
end
def tooltip_title(label)
nil
def wrap_link(link, label)
presenter = label.present(issuable_subject: project || group)
LabelsHelper.wrap_label_html(link, small: true, label: presenter)
end
def full_path_ref?(matches)
matches[:namespace] && matches[:project]
end
def reference_class(type, tooltip: true)
super + ' gl-link gl-label-link'
end
def object_link_title(object, matches)
# use title of wrapped element instead
nil
presenter = object.present(issuable_subject: project || group)
LabelsHelper.label_tooltip_title(presenter)
end
end
end
end
Banzai::Filter::LabelReferenceFilter.prepend_if_ee('EE::Banzai::Filter::LabelReferenceFilter')
......@@ -37,7 +37,8 @@ module Banzai
attributes[:reference_type] ||= self.class.reference_type
attributes[:container] ||= 'body'
attributes[:placement] ||= 'bottom'
attributes[:placement] ||= 'top'
attributes[:html] ||= 'true'
attributes.delete(:original) if context[:no_original_data]
attributes.map do |key, value|
%Q(data-#{key.to_s.dasherize}="#{escape_once(value)}")
......
......@@ -3,7 +3,7 @@
module Gitlab
module MarkdownCache
# Increment this number every time the renderer changes its output
CACHE_COMMONMARK_VERSION = 18
CACHE_COMMONMARK_VERSION = 19
CACHE_COMMONMARK_VERSION_START = 10
BaseError = Class.new(StandardError)
......
......@@ -277,7 +277,7 @@ describe 'Issue Boards', :js do
wait_for_requests
page.within('.value') do
expect(page).to have_selector('.badge', count: 2)
expect(page).to have_selector('.gl-label-text', count: 2)
expect(page).to have_content(development.title)
expect(page).to have_content(stretch.title)
end
......@@ -299,7 +299,7 @@ describe 'Issue Boards', :js do
find('.dropdown-menu-close-icon').click
page.within('.value') do
expect(page).to have_selector('.badge', count: 3)
expect(page).to have_selector('.gl-label-text', count: 3)
expect(page).to have_content(bug.title)
end
end
......@@ -328,7 +328,7 @@ describe 'Issue Boards', :js do
find('.dropdown-menu-close-icon').click
page.within('.value') do
expect(page).to have_selector('.badge', count: 4)
expect(page).to have_selector('.gl-label-text', count: 4)
expect(page).to have_content(bug.title)
expect(page).to have_content(regression.title)
end
......@@ -357,13 +357,13 @@ describe 'Issue Boards', :js do
find('.dropdown-menu-close-icon').click
page.within('.value') do
expect(page).to have_selector('.badge', count: 1)
expect(page).to have_selector('.gl-label-text', count: 1)
expect(page).not_to have_content(stretch.title)
end
end
# 'Development' label does not show since the card is in a 'Development' list label
expect(card).to have_selector('.badge', count: 0)
expect(card).to have_selector('.gl-label-text', count: 0)
expect(card).not_to have_content(stretch.title)
end
......
......@@ -41,10 +41,10 @@ describe 'issuable list' do
visit_issuable_list(issuable_type)
expect(all('.label-link')[0].text).to have_content('B')
expect(all('.label-link')[1].text).to have_content('X')
expect(all('.label-link')[2].text).to have_content('a')
expect(all('.label-link')[3].text).to have_content('z')
expect(all('.gl-label-text')[0].text).to have_content('B')
expect(all('.gl-label-text')[1].text).to have_content('X')
expect(all('.gl-label-text')[2].text).to have_content('a')
expect(all('.gl-label-text')[3].text).to have_content('z')
end
end
......
......@@ -332,7 +332,7 @@ describe 'Filter issues', :js do
context 'issue label clicked' do
it 'filters and displays in search bar' do
find('.issues-list .issue .issuable-main-info .issuable-info a .badge', text: multiple_words_label.title).click
find('.issues-list .issue .issuable-main-info .issuable-info a .gl-label-text', text: multiple_words_label.title).click
expect_issues_list_count(1)
expect_tokens([label_token("\"#{multiple_words_label.title}\"")])
......
......@@ -161,9 +161,9 @@ describe 'Labels Hierarchy', :js do
find('.btn-success').click
expect(page.find('.issue-details h2.title')).to have_content('new created issue')
expect(page).to have_selector('span.badge', text: grandparent_group_label.title)
expect(page).to have_selector('span.badge', text: parent_group_label.title)
expect(page).to have_selector('span.badge', text: project_label_1.title)
expect(page).to have_selector('span.gl-label-text', text: grandparent_group_label.title)
expect(page).to have_selector('span.gl-label-text', text: parent_group_label.title)
expect(page).to have_selector('span.gl-label-text', text: project_label_1.title)
end
end
......
......@@ -56,7 +56,7 @@ describe LabelsHelper do
context 'without subject' do
it "uses the label's project" do
expect(link_to_label(label_presenter)).to match %r{<a href="/#{label.project.full_path}/issues\?label_name%5B%5D=#{label.name}">.*</a>}
expect(link_to_label(label_presenter)).to match %r{<a.*href="/#{label.project.full_path}/issues\?label_name%5B%5D=#{label.name}".*>.*</a>}m
end
end
......@@ -65,7 +65,7 @@ describe LabelsHelper do
let(:subject) { build(:project, namespace: namespace, name: 'bar3') }
it 'links to project issues page' do
expect(link_to_label(label_presenter)).to match %r{<a href="/foo3/bar3/issues\?label_name%5B%5D=#{label.name}">.*</a>}
expect(link_to_label(label_presenter)).to match %r{<a.*href="/foo3/bar3/issues\?label_name%5B%5D=#{label.name}".*>.*</a>}m
end
end
......@@ -73,7 +73,7 @@ describe LabelsHelper do
let(:subject) { build(:group, name: 'bar') }
it 'links to group issues page' do
expect(link_to_label(label_presenter)).to match %r{<a href="/groups/bar/-/issues\?label_name%5B%5D=#{label.name}">.*</a>}
expect(link_to_label(label_presenter)).to match %r{<a.*href="/groups/bar/-/issues\?label_name%5B%5D=#{label.name}".*>.*</a>}m
end
end
......@@ -81,7 +81,7 @@ describe LabelsHelper do
['issue', :issue].each do |type|
context "set to #{type}" do
it 'links to correct page' do
expect(link_to_label(label_presenter, type: type)).to match %r{<a href="/#{label.project.full_path}/#{type.to_s.pluralize}\?label_name%5B%5D=#{label.name}">.*</a>}
expect(link_to_label(label_presenter, type: type)).to match %r{<a.*href="/#{label.project.full_path}/#{type.to_s.pluralize}\?label_name%5B%5D=#{label.name}".*>.*</a>}m
end
end
end
......@@ -89,7 +89,7 @@ describe LabelsHelper do
['merge_request', :merge_request].each do |type|
context "set to #{type}" do
it 'links to correct page' do
expect(link_to_label(label_presenter, type: type)).to match %r{<a href="/#{label.project.full_path}/-/#{type.to_s.pluralize}\?label_name%5B%5D=#{label.name}">.*</a>}
expect(link_to_label(label_presenter, type: type)).to match %r{<a.*href="/#{label.project.full_path}/-/#{type.to_s.pluralize}\?label_name%5B%5D=#{label.name}".*>.*</a>}m
end
end
end
......@@ -113,7 +113,7 @@ describe LabelsHelper do
context 'without block' do
it 'uses render_colored_label as the link content' do
expect(self).to receive(:render_colored_label)
.with(label_presenter, tooltip: true).and_return('Foo')
.with(label_presenter).and_return('Foo')
expect(link_to_label(label_presenter)).to match('Foo')
end
end
......
......@@ -537,8 +537,10 @@ describe MarkupHelper do
it 'does not style a label that can not be accessed by current_user' do
project = create(:project, :private)
label = create_and_format_label(project)
expect(create_and_format_label(project)).to eq("<p>#{label_title}</p>")
expect(label).to include("~label_1")
expect(label).not_to match(/span class=.*style=.*/)
end
end
......
......@@ -28,7 +28,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'includes default classes' do
doc = reference_filter("Label #{reference}")
expect(doc.css('a').first.attr('class')).to eq 'gfm gfm-label has-tooltip'
expect(doc.css('a').first.attr('class')).to eq 'gfm gfm-label has-tooltip gl-link gl-label-link'
end
it 'includes a data-project attribute' do
......@@ -66,12 +66,12 @@ describe Banzai::Filter::LabelReferenceFilter do
describe 'label span element' do
it 'includes default classes' do
doc = reference_filter("Label #{reference}")
expect(doc.css('a span').first.attr('class')).to eq 'badge color-label has-tooltip'
expect(doc.css('a span').first.attr('class')).to include 'gl-label-text'
end
it 'includes a style attribute' do
doc = reference_filter("Label #{reference}")
expect(doc.css('a span').first.attr('style')).to match(/\Abackground-color: #\h{6}; color: #\h{6}\z/)
expect(doc.css('a span').first.attr('style')).to match(/\Abackground-color: #\h{6}\z/)
end
end
......@@ -85,7 +85,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'links with adjacent text' do
doc = reference_filter("Label (#{reference}.)")
expect(doc.to_html).to match(%r(\(<a.+><span.+>#{label.name}</span></a>\.\)))
expect(doc.to_html).to match(%r(\(<span.+><a.+><span.+>#{label.name}</span></a></span>\.\)))
end
it 'ignores invalid label IDs' do
......@@ -109,7 +109,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'links with adjacent text' do
doc = reference_filter("Label (#{reference}).")
expect(doc.to_html).to match(%r(\(<a.+><span.+>#{label.name}</span></a>\)\.))
expect(doc.to_html).to match(%r(\(<span.+><a.+><span.+>#{label.name}</span></a></span>\)\.))
end
it 'ignores invalid label names' do
......@@ -133,7 +133,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'links with adjacent text' do
doc = reference_filter("Label (#{reference}).")
expect(doc.to_html).to match(%r(\(<a.+><span.+>#{label.name}</span></a>\)\.))
expect(doc.to_html).to match(%r(\(<span.+><a.+><span.+>#{label.name}</span></a></span>\)\.))
end
it 'ignores invalid label names' do
......@@ -158,7 +158,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'does not include trailing punctuation', :aggregate_failures do
['.', ', ok?', '...', '?', '!', ': is that ok?'].each do |trailing_punctuation|
doc = filter("Label #{reference}#{trailing_punctuation}")
expect(doc.to_html).to match(%r(<a.+><span.+>\?g\.fm&amp;</span></a>#{Regexp.escape(trailing_punctuation)}))
expect(doc.to_html).to match(%r(<span.+><a.+><span.+>\?g\.fm&amp;</span></a></span>#{Regexp.escape(trailing_punctuation)}))
end
end
......@@ -184,7 +184,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'links with adjacent text' do
doc = reference_filter("Label (#{reference}.)")
expect(doc.to_html).to match(%r(\(<a.+><span.+>#{label.name}</span></a>\.\)))
expect(doc.to_html).to match(%r(\(<span.+><a.+><span.+>#{label.name}</span></a></span>\.\)))
end
it 'ignores invalid label names' do
......@@ -208,7 +208,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'links with adjacent text' do
doc = reference_filter("Label (#{reference}.)")
expect(doc.to_html).to match(%r(\(<a.+><span.+>#{label.name}</span></a>\.\)))
expect(doc.to_html).to match(%r(\(<span.+><a.+><span.+>#{label.name}</span></a></span>\.\)))
end
it 'ignores invalid label names' do
......@@ -232,7 +232,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'links with adjacent text' do
doc = reference_filter("Label (#{reference}.)")
expect(doc.to_html).to match(%r(\(<a.+><span.+>g\.fm &amp; references\?</span></a>\.\)))
expect(doc.to_html).to match(%r(\(<span.+><a.+><span.+>g\.fm &amp; references\?</span></a></span>\.\)))
end
it 'ignores invalid label names' do
......@@ -320,7 +320,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'links with adjacent text' do
doc = reference_filter("Label (#{reference}.)")
expect(doc.to_html).to match(%r(\(<a.+>Label</a>\.\)))
expect(doc.to_html).to match(%r(\(<span.+><a.+>Label</a></span>\.\)))
end
it 'includes a data-project attribute' do
......@@ -358,7 +358,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'links with adjacent text' do
doc = reference_filter("Label (#{reference}.)")
expect(doc.to_html).to match(%r(\(<a.+><span.+>#{group_label.name}</span></a>\.\)))
expect(doc.to_html).to match(%r(\(<span.+><a.+><span.+>#{group_label.name}</span></a></span>\.\)))
end
it 'ignores invalid label names' do
......@@ -381,7 +381,7 @@ describe Banzai::Filter::LabelReferenceFilter do
it 'links with adjacent text' do
doc = reference_filter("Label (#{reference}.)")
expect(doc.to_html).to match(%r(\(<a.+><span.+>#{group_label.name}</span></a>\.\)))
expect(doc.to_html).to match(%r(\(<span.+><a.+><span.+>#{group_label.name}</span></a></span>\.\)))
end
it 'ignores invalid label names' do
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment