ActionText is a nice replacement for CKEditor/TinyMCE for content editing. It's embedded in the Rails core, works directly with ActiveStorage, and integrates very nicely.
Last week, I tried ActionText for the first time in the backend of my Spree store. To make this work I had to make several adjustments.
First I followed the default instructions of ActionText: https://edgeguides.rubyonrails.org/action_text_overview.html
I had to make webpacker active in the Spree backend. So I've included the javascript pack. (Is used content_for :head in mij CMS plugin view)
<% content_for :head do %>
<%= javascript_pack_tag('application', 'data-turbolinks-track': 'reload') %>
<% end %>
And activate the css in the spree shop stylesheets/spree/backlend/all.css
/*
*= require spree/backend
*= require ./../../actiontext
*= require_self
*= require_tree .
*/
At this point the ActionText editing was operational.
BUT, rendering didn't work as expected.
Images weren't shown when rendering the actiontext.
<%= cms.my_action_text %>
After a lot of debugging and playing around with /activestorage/blobs/_blob.html.erb
, I discovered the IMG tags were simply stripped!
I discovered the allowed tags were extremely limited. The IMG tag wasn't included??
To solve it, I added severy other allowed tags in a rails initializer:
# Workaround for issue with ActiveText... Somehow the Rails Sanetizer list is very restricted!!
ActionText::ContentHelper.allowed_tags = (ActionText::ContentHelper.allowed_tags +
["strong", "em", "b", "i", "p", "code", "pre", "tt", "samp", "kbd", "var", "sub", "sup", "dfn", "cite",
"big", "small", "address", "hr", "br", "div", "span", "h1", "h2", "h3", "h4", "h5", "h6", "ul", "ol",
"li", "dl", "dt", "dd", "abbr", "acronym", "a", "img", "blockquote", "del", "ins"]).uniq
ActionText::ContentHelper.allowed_attributes = (ActionText::ContentHelper.allowed_attributes +
["href", "src", "width", "height", "alt", "cite", "datetime", "title", "class", "name", "xml:lang", "abbr"]).uniq