inline_svg 1.5.2 → 1.6.0
Sign up to get free protection for your applications and to get access to all the features.
Potentially problematic release.
This version of inline_svg might be problematic. Click here for more details.
- checksums.yaml +4 -4
- data/.travis.yml +1 -1
- data/CHANGELOG.md +6 -0
- data/README.md +20 -26
- data/lib/inline_svg/action_view/helpers.rb +32 -2
- data/lib/inline_svg/version.rb +1 -1
- data/spec/helpers/inline_svg_spec.rb +31 -19
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 5141ac43ede6f67761b367d5697e8b007719bb445831bea6b689e712bf50414c
|
4
|
+
data.tar.gz: 6694ac5aa490995a47138013b550a28e738ae5d9f5fb0df72bdef476d802e0b0
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: 0310736a1123e9e5d42da01cc1dc4b966f369cd9c6931610623eb57921ce2b82119334224b6e953a130e374e3bd6cc47014fefbd4c1fb30ff1d87a09bf91b903
|
7
|
+
data.tar.gz: 95cbe5a123f9fa66bf2ea7510efccd017abf7e6269543dd8e22fd6b3bb0d7d165d7b37cd1a4ac891dc1412c811982b30037751c65be84ab3bfddf15d9c4f67d8
|
data/.travis.yml
CHANGED
data/CHANGELOG.md
CHANGED
@@ -5,6 +5,12 @@ This project adheres to [Semantic Versioning](http://semver.org/).
|
|
5
5
|
## [Unreleased][unreleased]
|
6
6
|
- Nothing
|
7
7
|
|
8
|
+
## [1.6.0] - 2019-11-13
|
9
|
+
### Added
|
10
|
+
- Support Webpack via the new `inline_svg_pack_tag` helper and deprecate `inline_svg` helper in preparation for v2.0.
|
11
|
+
[#103](https://github.com/jamesmartin/inline_svg/pull/103)
|
12
|
+
Thanks, [@kylefox](https://github.com/kylefox)
|
13
|
+
|
8
14
|
## [1.5.2] - 2019-06-20
|
9
15
|
### Fixed
|
10
16
|
- Revert automatic Webpack asset finder behavior. Make Webpack "opt-in".
|
data/README.md
CHANGED
@@ -6,7 +6,7 @@ Styling a SVG document with CSS for use on the web is most reliably achieved by
|
|
6
6
|
[adding classes to the document and
|
7
7
|
embedding](http://css-tricks.com/using-svg/) it inline in the HTML.
|
8
8
|
|
9
|
-
This gem adds
|
9
|
+
This gem adds Rails helper methods (`inline_svg_tag` and `inline_svg_pack_tag`) that read an SVG document (via Sprockets or Webpacker, so works with the Rails Asset Pipeline), applies a CSS class attribute to the root of the document and
|
10
10
|
then embeds it into a view.
|
11
11
|
|
12
12
|
Inline SVG supports:
|
@@ -16,18 +16,6 @@ Inline SVG supports:
|
|
16
16
|
- [Rails 5](http://weblog.rubyonrails.org/2016/6/30/Rails-5-0-final/) (from [v0.10.0](https://github.com/jamesmartin/inline_svg/releases/tag/v0.10.0))
|
17
17
|
- [Rails 6](https://weblog.rubyonrails.org/2019/4/24/Rails-6-0-rc1-released/) with Sprockets or Webpacker (from [v1.5.2](https://github.com/jamesmartin/inline_svg/releases/tag/v1.5.2)).
|
18
18
|
|
19
|
-
## Webpacker
|
20
|
-
|
21
|
-
|
22
|
-
Webpacker support is currently "opt-in" and must be manually configured like
|
23
|
-
so:
|
24
|
-
|
25
|
-
```ruby
|
26
|
-
InlineSvg.configure do |config|
|
27
|
-
config.asset_finder = InlineSvg::WebpackAssetFinder
|
28
|
-
end
|
29
|
-
```
|
30
|
-
|
31
19
|
## Changelog
|
32
20
|
|
33
21
|
This project adheres to [Semantic Versioning](http://semver.org). All notable changes are documented in the
|
@@ -49,9 +37,15 @@ Or install it yourself as:
|
|
49
37
|
|
50
38
|
## Usage
|
51
39
|
|
40
|
+
```ruby
|
41
|
+
# Sprockets
|
42
|
+
inline_svg_tag(file_name, options={})
|
43
|
+
|
44
|
+
# Webpacker
|
45
|
+
inline_svg_pack_tag(file_name, options={})
|
52
46
|
```
|
53
|
-
|
54
|
-
|
47
|
+
|
48
|
+
_**Note:** The remainder of this README uses `inline_svg_tag` for examples, but the exact same principles work for `inline_svg_pack_tag`._
|
55
49
|
|
56
50
|
The `file_name` can be a full path to a file, the file's basename or an `IO`
|
57
51
|
object. The
|
@@ -69,7 +63,7 @@ Here's an example of embedding an SVG document and applying a 'class' attribute:
|
|
69
63
|
<body>
|
70
64
|
<h1>Embedded SVG Documents</h1>
|
71
65
|
<div>
|
72
|
-
<%=
|
66
|
+
<%= inline_svg_tag "some-document.svg", class: 'some-class' %>
|
73
67
|
</div>
|
74
68
|
</body>
|
75
69
|
</html>
|
@@ -107,7 +101,7 @@ key | description
|
|
107
101
|
Example:
|
108
102
|
|
109
103
|
```ruby
|
110
|
-
|
104
|
+
inline_svg_tag(
|
111
105
|
"some-document.svg",
|
112
106
|
id: 'some-id',
|
113
107
|
class: 'some-class',
|
@@ -124,7 +118,7 @@ inline_svg(
|
|
124
118
|
|
125
119
|
## Accessibility
|
126
120
|
|
127
|
-
Use the `aria: true` option to make `
|
121
|
+
Use the `aria: true` option to make `inline_svg_tag` add the following
|
128
122
|
accessibility (a11y) attributes to your embedded SVG:
|
129
123
|
|
130
124
|
* Adds a `role="img"` attribute to the root SVG element
|
@@ -135,7 +129,7 @@ Here's an example:
|
|
135
129
|
|
136
130
|
```erb
|
137
131
|
<%=
|
138
|
-
|
132
|
+
inline_svg_tag('iconmonstr-glasses-12-icon.svg',
|
139
133
|
aria: true, title: 'An SVG',
|
140
134
|
desc: 'This is my SVG. There are many like it. You get the picture')
|
141
135
|
%>
|
@@ -149,11 +143,11 @@ Here's an example:
|
|
149
143
|
</svg>
|
150
144
|
```
|
151
145
|
|
152
|
-
***Note:*** The title and desc `id` attributes generated for, and referenced by, `aria-labelled-by` are one-way digests based on the value of the title and desc elements and an optional "salt" value using the SHA1 algorithm. This reduces the chance of `
|
146
|
+
***Note:*** The title and desc `id` attributes generated for, and referenced by, `aria-labelled-by` are one-way digests based on the value of the title and desc elements and an optional "salt" value using the SHA1 algorithm. This reduces the chance of `inline_svg_tag` embedding elements inside the SVG with `id` attributes that clash with other elements elsewhere on the page.
|
153
147
|
|
154
148
|
## Custom Transformations
|
155
149
|
|
156
|
-
The transformation behavior of `
|
150
|
+
The transformation behavior of `inline_svg_tag` can be customized by creating custom transformation classes.
|
157
151
|
|
158
152
|
For example, inherit from `InlineSvg::CustomTransformation` and implement the `#transform` method:
|
159
153
|
|
@@ -182,7 +176,7 @@ end
|
|
182
176
|
The custom transformation can then be called like so:
|
183
177
|
```haml
|
184
178
|
%div
|
185
|
-
=
|
179
|
+
= inline_svg_tag "some-document.svg", my_custom_attribute: 'some value'
|
186
180
|
```
|
187
181
|
|
188
182
|
In this example, the following transformation would be applied to a SVG document:
|
@@ -203,8 +197,8 @@ end
|
|
203
197
|
The custom transformation will be triggered even if you don't pass any attribute value
|
204
198
|
```haml
|
205
199
|
%div
|
206
|
-
=
|
207
|
-
=
|
200
|
+
= inline_svg_tag "some-document.svg"
|
201
|
+
= inline_svg_tag "some-document.svg", my_custom_attribute: 'some value'
|
208
202
|
```
|
209
203
|
|
210
204
|
In this example, the following transformation would be applied to a SVG document:
|
@@ -284,7 +278,7 @@ end
|
|
284
278
|
|
285
279
|
**Note:** Paths are read recursively, so think about keeping your SVG assets
|
286
280
|
restricted to as few paths as possible, and using the filter option to further
|
287
|
-
restrict assets to only those likely to be used by `
|
281
|
+
restrict assets to only those likely to be used by `inline_svg_tag`.
|
288
282
|
|
289
283
|
## Missing SVG Files
|
290
284
|
|
@@ -311,7 +305,7 @@ Which would instead render:
|
|
311
305
|
<svg class='svg-not-found'><!-- SVG file not found: 'some-missing-file.svg' --></svg>
|
312
306
|
```
|
313
307
|
|
314
|
-
Alternatively, `
|
308
|
+
Alternatively, `inline_svg_tag` can be configured to raise an exception when a file
|
315
309
|
is not found:
|
316
310
|
|
317
311
|
```ruby
|
@@ -4,7 +4,29 @@ require 'action_view/context' if defined?(Rails)
|
|
4
4
|
module InlineSvg
|
5
5
|
module ActionView
|
6
6
|
module Helpers
|
7
|
+
def inline_svg_tag(filename, transform_params={})
|
8
|
+
with_asset_finder(InlineSvg.configuration.asset_finder) do
|
9
|
+
render_inline_svg(filename, transform_params)
|
10
|
+
end
|
11
|
+
end
|
12
|
+
|
13
|
+
def inline_svg_pack_tag(filename, transform_params={})
|
14
|
+
with_asset_finder(InlineSvg::WebpackAssetFinder) do
|
15
|
+
render_inline_svg(filename, transform_params)
|
16
|
+
end
|
17
|
+
end
|
18
|
+
|
7
19
|
def inline_svg(filename, transform_params={})
|
20
|
+
ActiveSupport::Deprecation.warn(
|
21
|
+
'`inline_svg` is deprecated and will be removed from inline_svg 2.0 (use `inline_svg_tag` or `inline_svg_pack_tag` instead)'
|
22
|
+
)
|
23
|
+
|
24
|
+
render_inline_svg(filename, transform_params)
|
25
|
+
end
|
26
|
+
|
27
|
+
private
|
28
|
+
|
29
|
+
def render_inline_svg(filename, transform_params={})
|
8
30
|
begin
|
9
31
|
svg_file = read_svg(filename)
|
10
32
|
rescue InlineSvg::AssetFile::FileNotFound => error
|
@@ -23,8 +45,6 @@ module InlineSvg
|
|
23
45
|
InlineSvg::TransformPipeline.generate_html_from(svg_file, transform_params).html_safe
|
24
46
|
end
|
25
47
|
|
26
|
-
private
|
27
|
-
|
28
48
|
def read_svg(filename)
|
29
49
|
if InlineSvg::IOResource === filename
|
30
50
|
InlineSvg::IOResource.read filename
|
@@ -48,6 +68,16 @@ module InlineSvg
|
|
48
68
|
InlineSvg.configuration.asset_file
|
49
69
|
end
|
50
70
|
|
71
|
+
def with_asset_finder(asset_finder)
|
72
|
+
initial_asset_finder = InlineSvg.configuration.asset_finder
|
73
|
+
|
74
|
+
InlineSvg.configuration.asset_finder = asset_finder
|
75
|
+
output = yield
|
76
|
+
InlineSvg.configuration.asset_finder = initial_asset_finder
|
77
|
+
|
78
|
+
output
|
79
|
+
end
|
80
|
+
|
51
81
|
def extension_hint(filename)
|
52
82
|
filename.ends_with?(".svg") ? "" : "(Try adding .svg to your filename) "
|
53
83
|
end
|
data/lib/inline_svg/version.rb
CHANGED
@@ -13,7 +13,7 @@ describe InlineSvg::ActionView::Helpers do
|
|
13
13
|
|
14
14
|
let(:helper) { ( Class.new { include InlineSvg::ActionView::Helpers } ).new }
|
15
15
|
|
16
|
-
|
16
|
+
shared_examples "inline_svg helper" do |helper_method:|
|
17
17
|
|
18
18
|
context "when passed the name of an SVG that does not exist" do
|
19
19
|
after(:each) do
|
@@ -31,7 +31,7 @@ describe InlineSvg::ActionView::Helpers do
|
|
31
31
|
and_raise(InlineSvg::AssetFile::FileNotFound.new)
|
32
32
|
|
33
33
|
expect {
|
34
|
-
helper.
|
34
|
+
helper.send(helper_method, 'some-missing-file.svg')
|
35
35
|
}.to raise_error(InlineSvg::AssetFile::FileNotFound)
|
36
36
|
end
|
37
37
|
end
|
@@ -41,7 +41,7 @@ describe InlineSvg::ActionView::Helpers do
|
|
41
41
|
with('some-missing-file.svg').
|
42
42
|
and_raise(InlineSvg::AssetFile::FileNotFound.new)
|
43
43
|
|
44
|
-
output = helper.
|
44
|
+
output = helper.send(helper_method, 'some-missing-file.svg')
|
45
45
|
expect(output).to eq "<svg><!-- SVG file not found: 'some-missing-file.svg' --></svg>"
|
46
46
|
expect(output).to be_html_safe
|
47
47
|
end
|
@@ -51,7 +51,7 @@ describe InlineSvg::ActionView::Helpers do
|
|
51
51
|
with('missing-file-with-no-extension').
|
52
52
|
and_raise(InlineSvg::AssetFile::FileNotFound.new)
|
53
53
|
|
54
|
-
output = helper.
|
54
|
+
output = helper.send(helper_method, 'missing-file-with-no-extension')
|
55
55
|
expect(output).to eq "<svg><!-- SVG file not found: 'missing-file-with-no-extension' (Try adding .svg to your filename) --></svg>"
|
56
56
|
end
|
57
57
|
|
@@ -64,7 +64,7 @@ describe InlineSvg::ActionView::Helpers do
|
|
64
64
|
with('some-other-missing-file.svg').
|
65
65
|
and_raise(InlineSvg::AssetFile::FileNotFound.new)
|
66
66
|
|
67
|
-
output = helper.
|
67
|
+
output = helper.send(helper_method, 'some-other-missing-file.svg')
|
68
68
|
expect(output).to eq "<svg class='missing-svg'><!-- SVG file not found: 'some-other-missing-file.svg' --></svg>"
|
69
69
|
expect(output).to be_html_safe
|
70
70
|
end
|
@@ -79,7 +79,7 @@ describe InlineSvg::ActionView::Helpers do
|
|
79
79
|
<svg xmlns="http://www.w3.org/2000/svg" xml:lang="en"><!-- This is a comment --></svg>
|
80
80
|
SVG
|
81
81
|
allow(InlineSvg::AssetFile).to receive(:named).with('fallback.svg').and_return(fallback_file)
|
82
|
-
expect(helper.
|
82
|
+
expect(helper.send(helper_method, 'missing.svg', fallback: 'fallback.svg')).to eq fallback_file
|
83
83
|
end
|
84
84
|
end
|
85
85
|
end
|
@@ -92,7 +92,7 @@ SVG
|
|
92
92
|
<svg xmlns="http://www.w3.org/2000/svg" xml:lang="en"><!-- This is a comment --></svg>
|
93
93
|
SVG
|
94
94
|
allow(InlineSvg::AssetFile).to receive(:named).with('some-file').and_return(example_file)
|
95
|
-
expect(helper.
|
95
|
+
expect(helper.send(helper_method, 'some-file')).to eq example_file
|
96
96
|
end
|
97
97
|
end
|
98
98
|
|
@@ -105,7 +105,7 @@ SVG
|
|
105
105
|
<svg xmlns="http://www.w3.org/2000/svg" role="presentation" xml:lang="en"><title>A title</title></svg>
|
106
106
|
SVG
|
107
107
|
allow(InlineSvg::AssetFile).to receive(:named).with('some-file').and_return(input_svg)
|
108
|
-
expect(helper.
|
108
|
+
expect(helper.send(helper_method, 'some-file', title: 'A title')).to eq expected_output
|
109
109
|
end
|
110
110
|
end
|
111
111
|
|
@@ -118,7 +118,7 @@ SVG
|
|
118
118
|
<svg xmlns="http://www.w3.org/2000/svg" role="presentation" xml:lang="en"><desc>A description</desc></svg>
|
119
119
|
SVG
|
120
120
|
allow(InlineSvg::AssetFile).to receive(:named).with('some-file').and_return(input_svg)
|
121
|
-
expect(helper.
|
121
|
+
expect(helper.send(helper_method, 'some-file', desc: 'A description')).to eq expected_output
|
122
122
|
end
|
123
123
|
end
|
124
124
|
|
@@ -131,7 +131,7 @@ SVG
|
|
131
131
|
<svg xmlns="http://www.w3.org/2000/svg" xml:lang="en"></svg>
|
132
132
|
SVG
|
133
133
|
allow(InlineSvg::AssetFile).to receive(:named).with('some-file').and_return(input_svg)
|
134
|
-
expect(helper.
|
134
|
+
expect(helper.send(helper_method, 'some-file', nocomment: true)).to eq expected_output
|
135
135
|
end
|
136
136
|
end
|
137
137
|
|
@@ -144,7 +144,7 @@ SVG
|
|
144
144
|
<svg xmlns="http://www.w3.org/2000/svg" xml:lang="en" aria-hidden="true"></svg>
|
145
145
|
SVG
|
146
146
|
allow(InlineSvg::AssetFile).to receive(:named).with('some-file').and_return(input_svg)
|
147
|
-
expect(helper.
|
147
|
+
expect(helper.send(helper_method, 'some-file', aria_hidden: true)).to eq expected_output
|
148
148
|
end
|
149
149
|
end
|
150
150
|
|
@@ -157,7 +157,7 @@ SVG
|
|
157
157
|
<svg xmlns="http://www.w3.org/2000/svg" xml:lang="en"><title>A title</title><desc>A description</desc></svg>
|
158
158
|
SVG
|
159
159
|
allow(InlineSvg::AssetFile).to receive(:named).with('some-file').and_return(input_svg)
|
160
|
-
expect(helper.
|
160
|
+
expect(helper.send(helper_method, 'some-file', title: 'A title', desc: 'A description', nocomment: true)).to eq expected_output
|
161
161
|
end
|
162
162
|
end
|
163
163
|
|
@@ -180,7 +180,7 @@ SVG
|
|
180
180
|
<svg custom="some value"></svg>
|
181
181
|
SVG
|
182
182
|
allow(InlineSvg::AssetFile).to receive(:named).with('some-file').and_return(input_svg)
|
183
|
-
expect(helper.
|
183
|
+
expect(helper.send(helper_method, 'some-file', custom: 'some value')).to eq expected_output
|
184
184
|
end
|
185
185
|
end
|
186
186
|
|
@@ -201,7 +201,7 @@ SVG
|
|
201
201
|
|
202
202
|
allow(InlineSvg::AssetFile).to receive(:named).with('some-file').and_return(input_svg)
|
203
203
|
|
204
|
-
expect(helper.
|
204
|
+
expect(helper.send(helper_method, 'some-file')).to eq "<svg custom=\"default value\"></svg>\n"
|
205
205
|
end
|
206
206
|
end
|
207
207
|
|
@@ -211,7 +211,7 @@ SVG
|
|
211
211
|
|
212
212
|
allow(InlineSvg::AssetFile).to receive(:named).with('some-file').and_return(input_svg)
|
213
213
|
|
214
|
-
expect(helper.
|
214
|
+
expect(helper.send(helper_method, 'some-file', custom: 'some value')).to eq "<svg custom=\"some value\"></svg>\n"
|
215
215
|
end
|
216
216
|
end
|
217
217
|
end
|
@@ -223,13 +223,13 @@ SVG
|
|
223
223
|
expect(InlineSvg::IOResource).to receive(:===).with(argument).and_return(true)
|
224
224
|
expect(InlineSvg::IOResource).to receive(:read).with(argument)
|
225
225
|
expect(InlineSvg::AssetFile).to_not receive(:named)
|
226
|
-
helper.
|
226
|
+
helper.send(helper_method, argument)
|
227
227
|
end
|
228
228
|
it 'accept filename' do
|
229
229
|
expect(InlineSvg::IOResource).to receive(:===).with(argument).and_return(false)
|
230
230
|
expect(InlineSvg::IOResource).to_not receive(:read)
|
231
231
|
expect(InlineSvg::AssetFile).to receive(:named).with(argument)
|
232
|
-
helper.
|
232
|
+
helper.send(helper_method, argument)
|
233
233
|
end
|
234
234
|
end
|
235
235
|
context 'when passed IO object argument' do
|
@@ -239,17 +239,29 @@ SVG
|
|
239
239
|
it 'return valid svg' do
|
240
240
|
expect(InlineSvg::IOResource).to receive(:===).with(io_object).and_return(true)
|
241
241
|
expect(InlineSvg::IOResource).to receive(:read).with(io_object).and_return("<svg><!-- Test IO --></svg>")
|
242
|
-
output = helper.
|
242
|
+
output = helper.send(helper_method, io_object)
|
243
243
|
expect(output).to eq "<svg><!-- Test IO --></svg>\n"
|
244
244
|
expect(output).to be_html_safe
|
245
245
|
end
|
246
246
|
|
247
247
|
it 'return valid svg for file' do
|
248
|
-
output = helper.
|
248
|
+
output = helper.send(helper_method, File.new(file_path))
|
249
249
|
expect(output).to eq "<svg xmlns=\"http://www.w3.org/2000/svg\" xml:lang=\"en\" role=\"presentation\"><!-- This is a test comment --></svg>\n"
|
250
250
|
expect(output).to be_html_safe
|
251
251
|
end
|
252
252
|
|
253
253
|
end
|
254
254
|
end
|
255
|
+
|
256
|
+
describe '#inline_svg' do
|
257
|
+
it_behaves_like "inline_svg helper", helper_method: :inline_svg
|
258
|
+
end
|
259
|
+
|
260
|
+
describe '#inline_svg_tag' do
|
261
|
+
it_behaves_like "inline_svg helper", helper_method: :inline_svg_tag
|
262
|
+
end
|
263
|
+
|
264
|
+
describe '#inline_svg_tag' do
|
265
|
+
it_behaves_like "inline_svg helper", helper_method: :inline_svg_pack_tag
|
266
|
+
end
|
255
267
|
end
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: inline_svg
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.
|
4
|
+
version: 1.6.0
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- James Martin
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2019-
|
11
|
+
date: 2019-11-13 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: bundler
|