Browse Source

Render the og-tags and title for catalyst professionals page

develop
Bèr Kessels 1 year ago
parent
commit
38a49bf882

+ 3
- 0
Gemfile View File

@@ -52,6 +52,9 @@ group :development, :test do

# On development and test, load env from disk
gem 'dotenv-rails'

# In tests we parse the response and extract OG tags with ogp
gem 'ogp'
end

group :development do

+ 10
- 0
Gemfile.lock View File

@@ -59,6 +59,7 @@ GEM
zeitwerk (~> 2.2)
addressable (2.7.0)
public_suffix (>= 2.0.2, < 5.0)
ansi (1.5.0)
ast (2.4.0)
awesome_print (1.8.0)
bindex (0.8.1)
@@ -116,6 +117,11 @@ GEM
nio4r (2.5.2)
nokogiri (1.10.9)
mini_portile2 (~> 2.4.0)
oga (2.15)
ast
ruby-ll (~> 2.1)
ogp (0.4.0)
oga (~> 2.15)
pagy (3.7.5)
parallel (1.19.1)
parser (2.7.0.2)
@@ -172,6 +178,9 @@ GEM
rubocop-rails (2.4.2)
rack (>= 1.1)
rubocop (>= 0.72.0)
ruby-ll (2.1.2)
ansi
ast
ruby-progressbar (1.10.1)
ruby-vips (2.0.17)
ffi (~> 1.9)
@@ -244,6 +253,7 @@ DEPENDENCIES
jbuilder (~> 2.7)
listen (>= 3.0.5, < 3.2)
minitest (= 5.13.0)
ogp
pagy (~> 3.5)
pg (>= 0.18, < 2.0)
puma (~> 4.1)

+ 4
- 0
app/helpers/public_helper.rb View File

@@ -3,6 +3,10 @@
##
# Helpers for public views and templates
module PublicHelper
def title
content_for(:title) || ""
end

def catalyst
OpenStruct.new(Rails.application.config.catalyst)
end

+ 3
- 1
app/views/layouts/public.html.erb View File

@@ -10,9 +10,11 @@
<%= csrf_meta_tags %>
<%= csp_meta_tag %>

<%= yield :og_tags %>

<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_pack_tag 'application', 'data-turbolinks-track': 'reload' %>
<title>Professionals</title>
<title><%= title %></title>
</head>

<body>

+ 10
- 0
app/views/professionals/index.html.erb View File

@@ -1,3 +1,13 @@
<% content_for :title, "Professionals at #{catalyst.name}" %>

<% content_for :og_tags do %>
<meta property="og:title" content="<%= title %>" />
<meta property="og:type" content="website" />
<meta property="og:url" content="<%= request.original_url %>" />
<meta property="og:image" content="<%= image_url(catalyst.logo) %>" />
<% end %>


<%= render partial: "professional_card", collection: @professionals, as: :professional %>
<div class="col-12 d-flex justify-content-center">
<%== pagy_bootstrap_nav(@pagy) %>

+ 5
- 0
test/helpers/public_helper_test.rb View File

@@ -3,6 +3,11 @@
require 'test_helper'

class PublicHelperTest < ActionView::TestCase
test 'content_for :title sets the title' do
content_for :title, 'The title'
assert_equal 'The title', title
end

test 'simplified_format removes all tags with "sanitize"' do
text = '<foo/><p>bar</p>'
assert_equal 'bar', simplified_format(text)

+ 16
- 0
test/system/list_professionals_test.rb View File

@@ -1,6 +1,7 @@
# frozen_string_literal: true

require 'application_system_test_case'
require 'ogp' # For parsing OG tags

class ListProfessionalsTest < ApplicationSystemTestCase
setup do
@@ -62,4 +63,19 @@ class ListProfessionalsTest < ApplicationSystemTestCase
# We have 21 items per page (7 rows of 3), so page 2 has one.
assert_selector('div.card', count: 1)
end

# As a catalyst, when I share the link to the professionals on social media,
# then a card is rendered with a name, url, logo and title. So that
# others see a nice preview.
test 'link is shared on social media with og-tag support' do
visit root_url

assert_equal 'Professionals at Catalyst Inc.', page.title

open_graph = OGP::OpenGraph.new(page.html)
assert_equal 'Professionals at Catalyst Inc.', open_graph.title
assert_equal 'website', open_graph.type
assert_match(/catalyst_logo-.*\.png/, open_graph.image.url)
assert_equal page.current_url, open_graph.url
end
end

Loading…
Cancel
Save