hologram 1.2.0 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/.travis.yml +0 -1
- data/CHANGELOG.md +37 -0
- data/README.md +243 -5
- data/hologram.gemspec +2 -0
- data/lib/hologram.rb +2 -0
- data/lib/hologram/block_code_renderer.rb +45 -0
- data/lib/hologram/code_example_renderer.rb +73 -0
- data/lib/hologram/code_example_renderer/example.rb +27 -0
- data/lib/hologram/code_example_renderer/factory.rb +60 -0
- data/lib/hologram/code_example_renderer/renderers/haml_renderer.rb +17 -0
- data/lib/hologram/code_example_renderer/renderers/html_renderer.rb +6 -0
- data/lib/hologram/code_example_renderer/renderers/js_renderer.rb +5 -0
- data/lib/hologram/code_example_renderer/renderers/jsx_renderer.rb +4 -0
- data/lib/hologram/code_example_renderer/renderers/react_renderer.rb +21 -0
- data/lib/hologram/code_example_renderer/renderers/slim_renderer.rb +16 -0
- data/lib/hologram/code_example_renderer/template.rb +33 -0
- data/lib/hologram/display_message.rb +13 -0
- data/lib/hologram/doc_block_collection.rb +5 -1
- data/lib/hologram/doc_builder.rb +58 -7
- data/lib/hologram/doc_parser.rb +20 -4
- data/lib/hologram/document_block.rb +22 -4
- data/lib/hologram/link_helper.rb +18 -0
- data/lib/hologram/markdown_renderer.rb +56 -35
- data/lib/hologram/version.rb +1 -1
- data/lib/template/code_example_templates/js_example_template.html.erb +7 -0
- data/lib/template/code_example_templates/jsx_example_template.html.erb +7 -0
- data/lib/template/code_example_templates/markup_example_template.html.erb +10 -0
- data/lib/template/code_example_templates/markup_table_template.html.erb +23 -0
- data/lib/template/hologram_config.yml +23 -0
- data/spec/block_code_renderer_spec.rb +279 -0
- data/spec/code_example_renderer/example_spec.rb +26 -0
- data/spec/code_example_renderer/factory_spec.rb +102 -0
- data/spec/code_example_renderer/template_spec.rb +50 -0
- data/spec/display_message_spec.rb +18 -0
- data/spec/doc_block_collection_spec.rb +26 -1
- data/spec/doc_builder_spec.rb +28 -5
- data/spec/doc_parser_spec.rb +67 -7
- data/spec/document_block_spec.rb +33 -2
- data/spec/fixtures/source/components/button/buttons.css +8 -6
- data/spec/fixtures/source/components/button/skin/buttonSkins.css +17 -0
- data/spec/fixtures/styleguide/base_css.html +176 -52
- data/spec/fixtures/styleguide/index.html +6 -14
- data/spec/link_helper_spec.rb +57 -0
- data/spec/markdown_renderer_spec.rb +82 -0
- metadata +75 -19
@@ -24,13 +24,15 @@ There is also an additional modifier that will make the button take the
|
|
24
24
|
full width of the container. It may be used with the any of the button
|
25
25
|
size and style modifiers.
|
26
26
|
|
27
|
-
|
28
|
-
|
29
|
-
<button class="btn btnDefault btnLrg">Large</button> | `btn btnDefault btnLrg`
|
30
|
-
<button class="btn btnDefault">Default</button> | `btn btnDefault`
|
31
|
-
<button class="btn btnDefault btnSml">Small</button> | `btn btnDefault btnSml`
|
32
|
-
<button class="btn btnDefault btnFullWidth">Full width</button> | `btn btnDefault btnFullWidth`
|
27
|
+
```slim_example_table
|
28
|
+
button.btn.btnDefault.btnLrg Large
|
33
29
|
|
30
|
+
button.btn.btnDefault Default
|
31
|
+
|
32
|
+
button.btn.btnDefault.btnSml Small
|
33
|
+
|
34
|
+
button.btn.btnDefault.btnFullWidth Full width
|
35
|
+
```
|
34
36
|
*/
|
35
37
|
|
36
38
|
button {
|
@@ -5,6 +5,8 @@ name: buttonSkins
|
|
5
5
|
title: Button Styles
|
6
6
|
---
|
7
7
|
|
8
|
+
For buttons, see [the buttons docs][button].
|
9
|
+
|
8
10
|
Button | Class | Description
|
9
11
|
------------------------------------------------- | ----------------- | -----------
|
10
12
|
<button class="btn btnDefault">Default</button> | `btn btnDefault` | This is what buttons look like, this is the go to button style.
|
@@ -12,6 +14,21 @@ Button | Class | Descript
|
|
12
14
|
<button class="btn btnDanger">Delete</button> | `btn btnDanger` | This button is for delete actions, these actions should also have a confirmation dialog
|
13
15
|
<button class="btn btnDisabled">Disabled</button> | `btn btnDisabled` | I'm afraid I can't let you do that, yet.
|
14
16
|
|
17
|
+
```haml_example_table
|
18
|
+
%button.btn.btnDefault Hi
|
19
|
+
|
20
|
+
%button.btn.btnPrimary Hi
|
21
|
+
|
22
|
+
%button.btn.btnDanger Hi
|
23
|
+
|
24
|
+
%button.btn.btnDisabled Hi
|
25
|
+
```
|
26
|
+
|
27
|
+
Here's an example combining a style with a size
|
28
|
+
|
29
|
+
```haml_example
|
30
|
+
%button.btn.btnPrimary.btnFullWidth Hi
|
31
|
+
```
|
15
32
|
*/
|
16
33
|
|
17
34
|
.btnDefault,
|
@@ -59,12 +59,10 @@
|
|
59
59
|
|
60
60
|
|
61
61
|
|
62
|
-
<h1 id="background">Background Colors</h1>
|
63
|
-
|
64
|
-
<p>We have a few background colors that can be used in various contexts.
|
62
|
+
<h1 id="background" class="styleguide">Background Colors</h1>
|
63
|
+
<p class="styleguide">We have a few background colors that can be used in various contexts.
|
65
64
|
These are not for use as the entire page background but instead for
|
66
65
|
specific components and modules on the page.</p>
|
67
|
-
|
68
66
|
<div class="line txtC">
|
69
67
|
<div class="col cols6 ">
|
70
68
|
<div class="docSwatch backgroundLowlight"></div>
|
@@ -84,81 +82,207 @@ specific components and modules on the page.</p>
|
|
84
82
|
</div>
|
85
83
|
</div>
|
86
84
|
|
87
|
-
<h1 id="button">Buttons</h1>
|
88
|
-
|
89
|
-
|
90
|
-
|
91
|
-
<
|
85
|
+
<h1 id="button" class="styleguide">Buttons</h1>
|
86
|
+
<p class="styleguide">Button styles can be applied to any element. Typically you'll want to
|
87
|
+
use either a <code class="styleguide"><button></code> or an <code class="styleguide"><a></code> element:</p><div class="codeExample">
|
88
|
+
<div class="exampleOutput">
|
89
|
+
<button class="btn btnDefault">Click</button>
|
92
90
|
<a class="btn btnDefault" href="http://trulia.com">Don't click</a>
|
93
|
-
</div><div class="codeBlock"><div class="highlight"><pre><span class="nt"><button</span> <span class="na">class=</span><span class="s">"btn btnDefault"</span><span class="nt">></span>Click<span class="nt"></button></span>
|
94
|
-
<span class="nt"><a</span> <span class="na">class=</span><span class="s">"btn btnDefault"</span> <span class="na">href=</span><span class="s">"http://trulia.com"</span><span class="nt">></span>Don't click<span class="nt"></a></span>
|
95
|
-
</pre></div></div></div>
|
96
|
-
<p>If your button is actually a link to another page, please use the
|
97
|
-
<code><a></code> element, while if your button performs an action, such as submitting
|
98
|
-
a form or triggering some javascript event, then use a <code><button></code> element.</p>
|
99
91
|
|
92
|
+
</div>
|
93
|
+
<div class="codeBlock">
|
94
|
+
<div class="highlight">
|
95
|
+
<pre><span class="nt"><button</span> <span class="na">class=</span><span class="s">"btn btnDefault"</span><span class="nt">></span>Click<span class="nt"></button></span>
|
96
|
+
<span class="nt"><a</span> <span class="na">class=</span><span class="s">"btn btnDefault"</span> <span class="na">href=</span><span class="s">"http://trulia.com"</span><span class="nt">></span>Don't click<span class="nt"></a></span></pre>
|
97
|
+
</div>
|
98
|
+
</div>
|
99
|
+
</div>
|
100
|
+
<p class="styleguide">If your button is actually a link to another page, please use the
|
101
|
+
<code class="styleguide"><a></code> element, while if your button performs an action, such as submitting
|
102
|
+
a form or triggering some javascript event, then use a <code class="styleguide"><button></code> element.</p>
|
100
103
|
<h2>Button Sizes</h2>
|
101
|
-
|
102
|
-
<p>There are three 3 sizes for buttons: Large, medium (default)
|
104
|
+
<p class="styleguide">There are three 3 sizes for buttons: Large, medium (default)
|
103
105
|
and small. Simply apply the size modifier class for the desired size.
|
104
106
|
There is also an additional modifier that will make the button take the
|
105
107
|
full width of the container. It may be used with the any of the button
|
106
|
-
size and style modifiers.</p>
|
107
|
-
|
108
|
-
<
|
109
|
-
|
110
|
-
<
|
111
|
-
<th>
|
112
|
-
|
113
|
-
</
|
114
|
-
|
115
|
-
|
116
|
-
<td
|
117
|
-
|
118
|
-
<
|
119
|
-
<
|
120
|
-
|
121
|
-
</
|
122
|
-
|
123
|
-
|
124
|
-
|
125
|
-
|
126
|
-
<
|
127
|
-
<
|
128
|
-
<
|
129
|
-
</
|
130
|
-
</
|
108
|
+
size and style modifiers.</p><div class="codeTable">
|
109
|
+
<table>
|
110
|
+
<tbody>
|
111
|
+
|
112
|
+
<tr>
|
113
|
+
<th>
|
114
|
+
<div class="exampleOutput">
|
115
|
+
<button class="btn btnDefault btnLrg">Large</button>
|
116
|
+
</div>
|
117
|
+
</th>
|
118
|
+
<td>
|
119
|
+
<div class="codeBlock">
|
120
|
+
<div class="highlight">
|
121
|
+
<pre><span class="nt">button</span><span class="nc">.btn.btnDefault.btnLrg</span><span class="w"> </span>Large</pre>
|
122
|
+
</div>
|
123
|
+
</div>
|
124
|
+
</td>
|
125
|
+
</tr>
|
126
|
+
|
127
|
+
<tr>
|
128
|
+
<th>
|
129
|
+
<div class="exampleOutput">
|
130
|
+
<button class="btn btnDefault">Default</button>
|
131
|
+
</div>
|
132
|
+
</th>
|
133
|
+
<td>
|
134
|
+
<div class="codeBlock">
|
135
|
+
<div class="highlight">
|
136
|
+
<pre><span class="nt">button</span><span class="nc">.btn.btnDefault</span><span class="w"> </span>Default</pre>
|
137
|
+
</div>
|
138
|
+
</div>
|
139
|
+
</td>
|
140
|
+
</tr>
|
141
|
+
|
142
|
+
<tr>
|
143
|
+
<th>
|
144
|
+
<div class="exampleOutput">
|
145
|
+
<button class="btn btnDefault btnSml">Small</button>
|
146
|
+
</div>
|
147
|
+
</th>
|
148
|
+
<td>
|
149
|
+
<div class="codeBlock">
|
150
|
+
<div class="highlight">
|
151
|
+
<pre><span class="nt">button</span><span class="nc">.btn.btnDefault.btnSml</span><span class="w"> </span>Small</pre>
|
152
|
+
</div>
|
153
|
+
</div>
|
154
|
+
</td>
|
155
|
+
</tr>
|
156
|
+
|
157
|
+
<tr>
|
158
|
+
<th>
|
159
|
+
<div class="exampleOutput">
|
160
|
+
<button class="btn btnDefault btnFullWidth">Full width</button>
|
161
|
+
</div>
|
162
|
+
</th>
|
163
|
+
<td>
|
164
|
+
<div class="codeBlock">
|
165
|
+
<div class="highlight">
|
166
|
+
<pre><span class="nt">button</span><span class="nc">.btn.btnDefault.btnFullWidth</span><span class="w"> </span>Full<span class="w"> </span>width</pre>
|
167
|
+
</div>
|
168
|
+
</div>
|
169
|
+
</td>
|
170
|
+
</tr>
|
171
|
+
|
172
|
+
</tbody>
|
173
|
+
</table>
|
174
|
+
</div>
|
131
175
|
|
132
|
-
<h2 id="buttonSkins">Button Styles</h2>
|
133
176
|
|
134
|
-
<
|
135
|
-
<tr>
|
177
|
+
<h2 id="buttonSkins" class="styleguide">Button Styles</h2>
|
178
|
+
<p class="styleguide">For buttons, see <a class="styleguide" href="base_css.html#button" title="base_css.html#button">the buttons docs</a>.</p><table class="styleguide"> <tr>
|
136
179
|
<th>Button</th>
|
137
180
|
<th>Class</th>
|
138
181
|
<th>Description</th>
|
139
182
|
</tr>
|
140
|
-
|
141
|
-
<tr>
|
183
|
+
<tr>
|
142
184
|
<td><button class="btn btnDefault">Default</button></td>
|
143
|
-
<td><code>btn btnDefault</code></td>
|
185
|
+
<td><code class="styleguide">btn btnDefault</code></td>
|
144
186
|
<td>This is what buttons look like, this is the go to button style.</td>
|
145
187
|
</tr>
|
146
188
|
<tr>
|
147
189
|
<td><button class="btn btnPrimary">Primary</button></td>
|
148
|
-
<td><code>btn btnPrimary</code></td>
|
190
|
+
<td><code class="styleguide">btn btnPrimary</code></td>
|
149
191
|
<td>Use this button as the primary call to action</td>
|
150
192
|
</tr>
|
151
193
|
<tr>
|
152
194
|
<td><button class="btn btnDanger">Delete</button></td>
|
153
|
-
<td><code>btn btnDanger</code></td>
|
195
|
+
<td><code class="styleguide">btn btnDanger</code></td>
|
154
196
|
<td>This button is for delete actions, these actions should also have a confirmation dialog</td>
|
155
197
|
</tr>
|
156
198
|
<tr>
|
157
199
|
<td><button class="btn btnDisabled">Disabled</button></td>
|
158
|
-
<td><code>btn btnDisabled</code></td>
|
200
|
+
<td><code class="styleguide">btn btnDisabled</code></td>
|
159
201
|
<td>I'm afraid I can't let you do that, yet.</td>
|
160
202
|
</tr>
|
161
|
-
</
|
203
|
+
</table><div class="codeTable">
|
204
|
+
<table>
|
205
|
+
<tbody>
|
206
|
+
|
207
|
+
<tr>
|
208
|
+
<th>
|
209
|
+
<div class="exampleOutput">
|
210
|
+
<button class='btn btnDefault'>Hi</button>
|
211
|
+
|
212
|
+
</div>
|
213
|
+
</th>
|
214
|
+
<td>
|
215
|
+
<div class="codeBlock">
|
216
|
+
<div class="highlight">
|
217
|
+
<pre><span class="nt">%button</span><span class="nc">.btn.btnDefault</span> Hi</pre>
|
218
|
+
</div>
|
219
|
+
</div>
|
220
|
+
</td>
|
221
|
+
</tr>
|
222
|
+
|
223
|
+
<tr>
|
224
|
+
<th>
|
225
|
+
<div class="exampleOutput">
|
226
|
+
<button class='btn btnPrimary'>Hi</button>
|
227
|
+
|
228
|
+
</div>
|
229
|
+
</th>
|
230
|
+
<td>
|
231
|
+
<div class="codeBlock">
|
232
|
+
<div class="highlight">
|
233
|
+
<pre><span class="nt">%button</span><span class="nc">.btn.btnPrimary</span> Hi</pre>
|
234
|
+
</div>
|
235
|
+
</div>
|
236
|
+
</td>
|
237
|
+
</tr>
|
238
|
+
|
239
|
+
<tr>
|
240
|
+
<th>
|
241
|
+
<div class="exampleOutput">
|
242
|
+
<button class='btn btnDanger'>Hi</button>
|
243
|
+
|
244
|
+
</div>
|
245
|
+
</th>
|
246
|
+
<td>
|
247
|
+
<div class="codeBlock">
|
248
|
+
<div class="highlight">
|
249
|
+
<pre><span class="nt">%button</span><span class="nc">.btn.btnDanger</span> Hi</pre>
|
250
|
+
</div>
|
251
|
+
</div>
|
252
|
+
</td>
|
253
|
+
</tr>
|
254
|
+
|
255
|
+
<tr>
|
256
|
+
<th>
|
257
|
+
<div class="exampleOutput">
|
258
|
+
<button class='btn btnDisabled'>Hi</button>
|
259
|
+
|
260
|
+
</div>
|
261
|
+
</th>
|
262
|
+
<td>
|
263
|
+
<div class="codeBlock">
|
264
|
+
<div class="highlight">
|
265
|
+
<pre><span class="nt">%button</span><span class="nc">.btn.btnDisabled</span> Hi</pre>
|
266
|
+
</div>
|
267
|
+
</div>
|
268
|
+
</td>
|
269
|
+
</tr>
|
270
|
+
|
271
|
+
</tbody>
|
272
|
+
</table>
|
273
|
+
</div>
|
274
|
+
|
275
|
+
<p class="styleguide">Here's an example combining a style with a size</p><div class="codeExample">
|
276
|
+
<div class="exampleOutput">
|
277
|
+
<button class='btn btnPrimary btnFullWidth'>Hi</button>
|
278
|
+
|
279
|
+
</div>
|
280
|
+
<div class="codeBlock">
|
281
|
+
<div class="highlight">
|
282
|
+
<pre><span class="nt">%button</span><span class="nc">.btn.btnPrimary.btnFullWidth</span> Hi</pre>
|
283
|
+
</div>
|
284
|
+
</div>
|
285
|
+
</div>
|
162
286
|
</div>
|
163
287
|
</div>
|
164
288
|
</section>
|
@@ -54,26 +54,18 @@
|
|
54
54
|
|
55
55
|
|
56
56
|
<h1>Welcome</h1>
|
57
|
-
|
58
|
-
<
|
59
|
-
|
60
|
-
maintain.</p>
|
61
|
-
|
62
|
-
<p>The goal of hologram is to make it easy to document your CSS and to
|
57
|
+
<p class="styleguide">This style guide is an example of what
|
58
|
+
<a class="styleguide" href="http://trulia.github.io/hologram" title="http://trulia.github.io/hologram">hologram</a> can help you build and
|
59
|
+
maintain.</p><p class="styleguide">The goal of hologram is to make it easy to document your CSS and to
|
63
60
|
display the code examples to use that CSS. Hologram has no
|
64
61
|
opinions about how you should actually organize/style your style guide.
|
65
62
|
You could do everything as a single file with no header/footer and it
|
66
63
|
would work just fine. Or, you could break it up into an individual file
|
67
64
|
for each component. Top navigation, left navigation, no
|
68
|
-
navigation....that's up to you. Build it however you'd like. </p>
|
69
|
-
|
70
|
-
<p>We've borrowed some of <a href="http://trulia.com">Trulia</a>'s own CSS library to
|
65
|
+
navigation....that's up to you. Build it however you'd like. </p><p class="styleguide">We've borrowed some of <a class="styleguide" href="http://trulia.com" title="http://trulia.com">Trulia</a>'s own CSS library to
|
71
66
|
demonstrate how hologram can be used. If you want more details about
|
72
|
-
hologram see the <a href="http://github.com/trulia/hologram">git repository</a>. </p>
|
73
|
-
|
74
|
-
<p>This is a work in progress, please consider contributing to
|
75
|
-
<a href="http://github.com/trulia/hologram">hologram</a>.</p>
|
76
|
-
</div>
|
67
|
+
hologram see the <a class="styleguide" href="http://github.com/trulia/hologram" title="http://github.com/trulia/hologram">git repository</a>. </p><p class="styleguide">This is a work in progress, please consider contributing to
|
68
|
+
<a class="styleguide" href="http://github.com/trulia/hologram" title="http://github.com/trulia/hologram">hologram</a>.</p> </div>
|
77
69
|
</div>
|
78
70
|
</section>
|
79
71
|
<footer>
|
@@ -0,0 +1,57 @@
|
|
1
|
+
require 'spec_helper'
|
2
|
+
require 'hologram/link_helper'
|
3
|
+
|
4
|
+
describe Hologram::LinkHelper do
|
5
|
+
let(:pages) do
|
6
|
+
[
|
7
|
+
{
|
8
|
+
name: 'elements.html',
|
9
|
+
component_names: [
|
10
|
+
'images',
|
11
|
+
'buttons',
|
12
|
+
'typography',
|
13
|
+
]
|
14
|
+
}, {
|
15
|
+
name: 'utilities.html',
|
16
|
+
component_names: [
|
17
|
+
'whitespace',
|
18
|
+
'typography'
|
19
|
+
]
|
20
|
+
}
|
21
|
+
]
|
22
|
+
end
|
23
|
+
|
24
|
+
let(:link_helper) { described_class.new(pages) }
|
25
|
+
|
26
|
+
describe '#link_for' do
|
27
|
+
subject { link_helper.link_for(component_name) }
|
28
|
+
|
29
|
+
context 'when the link doesnt belong to any page' do
|
30
|
+
let(:component_name) { 'hamburger' }
|
31
|
+
it { should be_nil }
|
32
|
+
end
|
33
|
+
|
34
|
+
context 'when the link belongs to only one page' do
|
35
|
+
let(:component_name) { 'whitespace' }
|
36
|
+
it { should == 'utilities.html#whitespace' }
|
37
|
+
end
|
38
|
+
|
39
|
+
context 'when the link belongs to more than one page' do
|
40
|
+
let(:component_name) { 'typography' }
|
41
|
+
it 'creates a link to the first page the component appears on' do
|
42
|
+
expect(subject).to eq 'elements.html#typography'
|
43
|
+
end
|
44
|
+
end
|
45
|
+
end
|
46
|
+
|
47
|
+
describe '#all_links' do
|
48
|
+
it 'returns a hash from component name to link' do
|
49
|
+
expect(link_helper.all_links).to eq ({
|
50
|
+
'images' => 'elements.html#images',
|
51
|
+
'buttons' => 'elements.html#buttons',
|
52
|
+
'typography' => 'elements.html#typography',
|
53
|
+
'whitespace' => 'utilities.html#whitespace',
|
54
|
+
})
|
55
|
+
end
|
56
|
+
end
|
57
|
+
end
|
@@ -0,0 +1,82 @@
|
|
1
|
+
require 'spec_helper'
|
2
|
+
require 'hologram/link_helper'
|
3
|
+
|
4
|
+
describe Hologram::MarkdownRenderer do
|
5
|
+
let(:renderer) { described_class.new }
|
6
|
+
|
7
|
+
describe '#preprocess' do
|
8
|
+
subject { renderer.preprocess(document) }
|
9
|
+
|
10
|
+
let(:document) do
|
11
|
+
[
|
12
|
+
"<p>i'm a <a href='#'>proper reference link</a></p>",
|
13
|
+
"<p>i'm similar to an [invalid reference link] [but not quite]</p>",
|
14
|
+
].join("\n")
|
15
|
+
end
|
16
|
+
|
17
|
+
context 'when the renderer has a link helper' do
|
18
|
+
let(:renderer) { described_class.new(link_helper: Hologram::LinkHelper.new([
|
19
|
+
{
|
20
|
+
name: 'elements.html',
|
21
|
+
component_names: ['link', 'typography']
|
22
|
+
},
|
23
|
+
{
|
24
|
+
name: 'objects.html',
|
25
|
+
component_names: ['alert']
|
26
|
+
}
|
27
|
+
])) }
|
28
|
+
|
29
|
+
it 'prepends a list of component names and links to the document' do
|
30
|
+
expect(subject).to eq [
|
31
|
+
"[link]: elements.html#link",
|
32
|
+
"[typography]: elements.html#typography",
|
33
|
+
"[alert]: objects.html#alert",
|
34
|
+
"<p>i'm a <a href='#'>proper reference link</a></p>",
|
35
|
+
"<p>i'm similar to an [invalid reference link] [but not quite]</p>",
|
36
|
+
].join("\n")
|
37
|
+
end
|
38
|
+
end
|
39
|
+
|
40
|
+
context 'when the renderer has no link helper' do
|
41
|
+
it 'does not modify the document' do
|
42
|
+
expect(subject).to eq document
|
43
|
+
end
|
44
|
+
end
|
45
|
+
end
|
46
|
+
|
47
|
+
describe '#postprocess' do
|
48
|
+
subject { renderer.postprocess(document) }
|
49
|
+
|
50
|
+
context 'when the document is free of invalid reference links' do
|
51
|
+
let(:document) do
|
52
|
+
[
|
53
|
+
"<p>i'm a <a href='#'>proper reference link</a></p>",
|
54
|
+
"<p>i'm similar to an [invalid reference link] [but not quite]</p>",
|
55
|
+
].join("\n")
|
56
|
+
end
|
57
|
+
|
58
|
+
it 'does not print a warning' do
|
59
|
+
expect(Hologram::DisplayMessage).not_to receive(:warning)
|
60
|
+
subject
|
61
|
+
end
|
62
|
+
end
|
63
|
+
|
64
|
+
context 'when the document contains invalid reference links' do
|
65
|
+
let(:document) do
|
66
|
+
[
|
67
|
+
"<p>hey look at me i'm an [invalid reference link][invalid1]</p>",
|
68
|
+
"<p>hey look at me i'm [one as well][invalid2]</p>",
|
69
|
+
"<p>why aren't you two <a href='#'>proper reference links?</a></p>",
|
70
|
+
"<p>i'm similar to an [invalid reference link] [but not quite]</p>",
|
71
|
+
].join("\n")
|
72
|
+
end
|
73
|
+
|
74
|
+
it 'prints a warning for each invalid reference link' do
|
75
|
+
expect(Hologram::DisplayMessage).to receive(:warning).twice
|
76
|
+
subject
|
77
|
+
end
|
78
|
+
end
|
79
|
+
end
|
80
|
+
end
|
81
|
+
|
82
|
+
|