blob: 861b10c3f69e3d5ee4da583c1412617d2fb610a1 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
|
# frozen_string_literal: true
require "spec_helper"
RSpec.describe Pajamas::BannerComponent, type: :component do
subject do
described_class.new(**options)
end
let(:title) { "Banner title" }
let(:content) { "Banner content" }
let(:options) { {} }
describe 'basic usage' do
before do
render_inline(subject) do |c|
c.title { title }
content
end
end
it 'renders its content' do
expect(page).to have_text content
end
it 'renders its title' do
expect(page).to have_css "h1[class='gl-banner-title']", text: title
end
it 'renders a close button' do
expect(page).to have_css "button.gl-banner-close"
end
describe 'button_text and button_link' do
let(:options) { { button_text: 'Learn more', button_link: '/learn-more' } }
it 'define the primary action' do
expect(page).to have_css "a.btn-confirm.gl-button[href='/learn-more']", text: 'Learn more'
end
end
describe 'banner_options' do
let(:options) { { banner_options: { class: "baz", data: { foo: "bar" } } } }
it 'are on the banner' do
expect(page).to have_css ".gl-banner.baz[data-foo='bar']"
end
context 'with custom classes' do
let(:options) { { variant: :introduction, banner_options: { class: 'extra special' } } }
it 'don\'t conflict with internal banner_classes' do
expect(page).to have_css '.extra.special.gl-banner-introduction.gl-banner'
end
end
end
describe 'close_options' do
let(:options) { { close_options: { class: "js-foo", data: { uid: "123" } } } }
it 'are on the close button' do
expect(page).to have_css "button.gl-banner-close.js-foo[data-uid='123']"
end
end
describe 'embedded' do
context 'by default (false)' do
it 'keeps the banner\'s borders' do
expect(page).not_to have_css ".gl-banner.gl-border-none"
end
end
context 'when set to true' do
let(:options) { { embedded: true } }
it 'removes the banner\'s borders' do
expect(page).to have_css ".gl-banner.gl-border-none"
end
end
end
describe 'variant' do
context 'by default (promotion)' do
it 'applies no variant class' do
expect(page).to have_css "[class='gl-banner']"
end
end
context 'when set to introduction' do
let(:options) { { variant: :introduction } }
it "applies the introduction class to the banner" do
expect(page).to have_css ".gl-banner.gl-banner-introduction"
end
it "applies the confirm class to the close button" do
expect(page).to have_css ".gl-banner-close.btn-confirm.btn-confirm-tertiary"
end
end
context 'when set to unknown variant' do
let(:options) { { variant: :foobar } }
it 'ignores the unknown variant' do
expect(page).to have_css "[class='gl-banner']"
end
end
end
describe 'illustration' do
it 'has none by default' do
expect(page).not_to have_css ".gl-banner-illustration"
end
context 'with svg_path' do
let(:options) { { svg_path: 'logo.svg' } }
it 'renders an image as illustration' do
expect(page).to have_css ".gl-banner-illustration img"
end
end
end
end
context 'with illustration slot' do
before do
render_inline(subject) do |c|
c.title { title }
c.illustration { "<svg></svg>".html_safe }
content
end
end
it 'renders the slot content as illustration' do
expect(page).to have_css ".gl-banner-illustration svg"
end
context 'and conflicting svg_path' do
let(:options) { { svg_path: 'logo.svg' } }
it 'uses the slot content' do
expect(page).to have_css ".gl-banner-illustration svg"
expect(page).not_to have_css ".gl-banner-illustration img"
end
end
end
context 'with primary_action slot' do
before do
render_inline(subject) do |c|
c.title { title }
c.primary_action { "<a class='special' href='#'>Special</a>".html_safe }
content
end
end
it 'renders the slot content as the primary action' do
expect(page).to have_css "a.special", text: 'Special'
end
context 'and conflicting button_text and button_link' do
let(:options) { { button_text: 'Not special', button_link: '/' } }
it 'uses the slot content' do
expect(page).to have_css "a.special[href='#']", text: 'Special'
expect(page).not_to have_css "a.btn[href='/']"
end
end
end
end
|