-
Notifications
You must be signed in to change notification settings - Fork 35
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Add data attribute api to all tag types.
This introduces a new feature that enhances the api to accept a data attribute. ``` meta( tag_type: { value: 'value', data: { 'data-attr-name' => 'data attr value' } } ) ``` Multiple data attributes can be specified: ``` meta( tag_type: { value: 'value', data: { 'attr-1' => 'one', 'attr-2' => 'two' } } ) ``` Custom tags can be registered: ``` Metamagic::Renderer.register_tag_type :custom, ->(key, value, data) do tag(:custom_tag, name: key, value: value, data: data) end ``` This is backwards compatible with the existing api.
- Loading branch information
Showing
12 changed files
with
263 additions
and
18 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,7 +1,18 @@ | ||
module Metamagic | ||
class LinkTag < Tag | ||
def to_html | ||
interpolated_values.map { |value| tag(:link, rel: key, href: value) }.join("\n").html_safe.presence | ||
interpolated_values.map do |value| | ||
options = { | ||
rel: key, | ||
href: value.value, | ||
data: value.data | ||
}.compact | ||
|
||
tag(:link, **options) | ||
end | ||
.join("\n") | ||
.html_safe | ||
.presence | ||
end | ||
end | ||
end | ||
end |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,11 +1,22 @@ | ||
module Metamagic | ||
class PropertyTag < Tag | ||
def to_html | ||
interpolated_values.map { |value| tag(:meta, property: key, content: value) }.join("\n").html_safe.presence | ||
interpolated_values.map do |value| | ||
options = { | ||
property: key, | ||
content: value.value, | ||
data: value.data | ||
}.compact | ||
|
||
tag(:meta, **options) | ||
end | ||
.join("\n") | ||
.html_safe | ||
.presence | ||
end | ||
|
||
def sort_order | ||
3 | ||
end | ||
end | ||
end | ||
end |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -1,11 +1,13 @@ | ||
module Metamagic | ||
class TitleTag < Tag | ||
def to_html | ||
content_tag(:title, interpolated_values.join(separator).html_safe) if interpolated_values.any? | ||
values = interpolated_values.map(&:value).join(separator).html_safe | ||
|
||
content_tag(:title, values) if values.length > 0 | ||
end | ||
|
||
def sort_order | ||
1 | ||
end | ||
end | ||
end | ||
end |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,46 @@ | ||
module Metamagic | ||
class Value | ||
def self.create_escaped(value) | ||
value.is_a?(Hash) ? ValueHash.new(value) : ValueString.new(value) | ||
end | ||
|
||
def escape(string) | ||
ERB::Util.html_escape(string) | ||
end | ||
end | ||
|
||
class ValueString < Value | ||
attr_reader :value | ||
def initialize(value) | ||
@value = escape(value) | ||
end | ||
|
||
def data | ||
nil | ||
end | ||
end | ||
|
||
class ValueHash < Value | ||
attr_reader :value_hash | ||
def initialize(value_hash) | ||
@value_hash = value_hash | ||
@value_hash[:value] = if value.is_a?(Array) | ||
value.map { |v| escape(v) } | ||
else | ||
escape(value) | ||
end | ||
|
||
if @value_hash.key?(:data) | ||
@value_hash[:data] = data.map { |k, v| [escape(k), escape(v)] }.to_h | ||
end | ||
end | ||
|
||
def value | ||
value_hash[:value] | ||
end | ||
|
||
def data | ||
value_hash[:data] | ||
end | ||
end | ||
end |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,112 @@ | ||
require 'test_helper' | ||
|
||
class DataAttributeTest < ActionView::TestCase | ||
include Metamagic::ViewHelper | ||
|
||
test "title" do | ||
meta title: { | ||
value: "Test Title", | ||
data: { "test-attr" => "title" } | ||
} | ||
|
||
assert_equal_segment %{<title data-test-attr="title">Test Title</title>}, | ||
metamagic | ||
end | ||
|
||
test "title with multiple data attrs" do | ||
meta title: { | ||
value: "Test Title", | ||
data: { "test-attr-1" => "one", "test-attr-2" => "two" } | ||
} | ||
|
||
assert_equal_segment %{<title data-test-1="one" data-test-2="two">Test Title</title>}, | ||
metamagic | ||
end | ||
|
||
test "title with data attr api and no data attribute specified" do | ||
meta title: { value: "Test Title" } | ||
|
||
assert_equal_segment %{<title>Test Title</title>}, | ||
metamagic | ||
end | ||
|
||
test "link rel with data attr" do | ||
meta rel: { | ||
author: { | ||
value: "http://test.com/author.html", | ||
data: { "test-attr" => "test" } | ||
} | ||
} | ||
rel publisher: { | ||
value: "http://test.com/publisher.html", | ||
data: { "test-attr" => "test" } | ||
} | ||
|
||
assert_equal_segment %{<link href="http://test.com/author.html" rel="author" data-test-attr="test"/>\n<link href="http://test.com/publisher.html" rel="publisher" data-test-attr="test"/>}, | ||
metamagic | ||
end | ||
|
||
test "twitter tag with data attribute" do | ||
meta title: "Test Title", | ||
twitter: { | ||
card: { | ||
value: :summary, | ||
data: { "test-attr" => "test" } | ||
} | ||
} | ||
twitter site: { | ||
value: "@flickr", | ||
data: { "test-attr" => "test" } | ||
} | ||
|
||
assert_equal_segment %{<title>Test Title</title>\n<meta content="summary" name="twitter:card" data-test-attr="test" />\n<meta content="@flickr" name="twitter:site" data-test-attr="test" />}, | ||
metamagic | ||
end | ||
|
||
test "meta tags with data attr" do | ||
meta keywords: { | ||
value: %w{one two three}, | ||
data: { "test-attr" => "test" } | ||
}, | ||
description: { | ||
value: "My description", | ||
data: { "test-attr" => "test" } | ||
} | ||
|
||
assert_equal_segment %{<meta content="one, two, three" name="keywords" data-test-attr="test" />\n<meta content="My description" name="description" data-test-attr="test" />}, | ||
metamagic | ||
end | ||
|
||
test "open graph tags with data attr" do | ||
meta og: { | ||
image: { | ||
url: { | ||
value: "http://test.com/image.jpg", | ||
data: { "test-attr" => "test" } | ||
} | ||
} | ||
} | ||
|
||
assert_equal_segment %{<meta content="http://test.com/image.jpg" property="og:image:url" data-test-attr="test" />}, | ||
metamagic | ||
end | ||
|
||
test "custom tags with data attr" do | ||
Metamagic::Renderer.register_tag_type :custom, ->(key, value, data) { tag(:custom_tag, one: key, two: value, data: data) } | ||
|
||
meta title: "Test Title", | ||
custom: { | ||
first: { | ||
value: "This is the first", | ||
data: { "test-attr" => "test" } | ||
}, | ||
second: { | ||
value: "This is the second", | ||
data: { "test-attr" => "test" } | ||
} | ||
} | ||
|
||
assert_equal %{<title>Test Title</title>\n<custom_tag one="custom:first" two="This is the first" data-test-attr="test" />\n<custom_tag one="custom:second" two="This is the second" data-test-attr="test" />}, | ||
metamagic | ||
end | ||
end |