Commit 09d95dca authored by Kushal Pandya's avatar Kushal Pandya

Update GlTab helpers

- Update `gl_tab_link_to` to allow adding
  custom tab class.
- Update `gl_tab_counter_badge` to allow
  adding data attributes.

Changelog: other
parent 36dd34fb
......@@ -33,7 +33,6 @@ module TabHelper
# :item_active - Overrides the default state focing the "active" css classes (optional).
#
def gl_tab_link_to(name = nil, options = {}, html_options = {}, &block)
tab_class = 'nav-item'
link_classes = %w[nav-link gl-tab-nav-item]
active_link_classes = %w[active gl-tab-nav-item-active gl-tab-nav-item-active-indigo]
......@@ -52,6 +51,8 @@ module TabHelper
end
html_options = html_options.except(:item_active)
extra_tab_classes = html_options.delete(:tab_class)
tab_class = %w[nav-item].push(*extra_tab_classes)
content_tag(:li, class: tab_class, role: 'presentation') do
if block_given?
......@@ -215,6 +216,7 @@ def gl_tab_counter_badge(count, html_options = {})
badge_classes = %w[badge badge-muted badge-pill gl-badge sm gl-tab-counter-badge]
content_tag(:span,
count,
class: [*html_options[:class], badge_classes].join(' ')
class: [*html_options[:class], badge_classes].join(' '),
data: html_options[:data]
)
end
......@@ -36,7 +36,15 @@ RSpec.describe TabHelper do
expect(gl_tab_link_to('/url') { 'block content' }).to match(/block content/)
end
it 'creates a tab with custom classes' do
it 'creates a tab with custom classes for enclosing list item without content block provided' do
expect(gl_tab_link_to('Link', '/url', { tab_class: 'my-class' })).to match(/<li class=".*my-class.*"/)
end
it 'creates a tab with custom classes for enclosing list item with content block provided' do
expect(gl_tab_link_to('/url', { tab_class: 'my-class' }) { 'Link' }).to match(/<li class=".*my-class.*"/)
end
it 'creates a tab with custom classes for anchor element' do
expect(gl_tab_link_to('Link', '/url', { class: 'my-class' })).to match(/<a class=".*my-class.*"/)
end
......@@ -161,5 +169,11 @@ RSpec.describe TabHelper do
expect(gl_tab_counter_badge(1, { class: 'js-test' })).to eq('<span class="js-test badge badge-muted badge-pill gl-badge sm gl-tab-counter-badge">1</span>')
end
end
context 'with data attributes' do
it 'creates a tab counter badge with the data attributes' do
expect(gl_tab_counter_badge(1, { data: { some_attribute: 'foo' } })).to eq('<span class="badge badge-muted badge-pill gl-badge sm gl-tab-counter-badge" data-some-attribute="foo">1</span>')
end
end
end
end
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