WordPress embed block working differently between editor and front end

[bobbingwide]

For a while now I've been using the WordPress embed block to embed content from another site / same site but have been noticing strange anomalies. Sometimes the embed works fine in the editor but doesn't display the same output in the front end.

Steps to reproduce

With / without oik

First attempt
I tried reproducing the problem in s.b/cwiccer, with a simple embed from the same site. ( s.b/cwiccer/gm ) It worked OK when oik wasn't activated but didn't when oik was activated. I'd chosen a bad example. The post ( entitled GM ) used the [bw_show_googlemap] shortcode.

Second attempt
Embedding sb/cwiccer/pagey-posts produced the same result regardless of oik's activation status.

Here you can tell that oik's activated since the [oik] shortcode has been expanded to oik

[bobbingwide]

Third attempt
The problem is known to occur in s.b/oikcom embedding https://s.b/oikcom/wordpress-plugins-from-oik-plugins/oik-base-plugin/oik-jquery-library/. In the front end all I get to see is the link. The generated HTML is

<figure class="wp-block-embed-wordpress wp-block-embed is-type-wp-embed is-provider-oik-plugins-com">
<div class="wp-block-embed__wrapper">
<blockquote class="wp-embedded-content" data-secret="TlJhsdqOKY">
<p><a href="https://s.b/oikcom/wordpress-plugins-from-oik-plugins/oik-base-plugin/oik-jquery-library/">oik jQuery library</a></p>
</blockquote>
<p>
<iframe class="wp-embedded-content" 
sandbox="allow-scripts" 
security="restricted" 
style="position: absolute; clip: rect(1px, 1px, 1px, 1px);" 
title="&#8220;oik jQuery library&#8221; &#8212; 
<span class="bw_oik"><abbr  title="OIK Information Kit">oik</abbr></span> plugins.com&#8221; 

src=&#8221;https://s.b/oikcom/wordpress-plugins-from-oik-plugins/oik-base-plugin/oik-jquery-library/embed/#?secret=TlJhsdqOKY&#8221; 
data-secret=&#8221;TlJhsdqOKY&#8221; 
width=&#8221;500&#8243; 
height=&#8221;282&#8243; 
frameborder=&#8221;0&#8243; 
marginwidth=&#8221;0&#8243; 
marginheight=&#8221;0&#8243; 
scrolling=&#8221;no&#8221;></iframe>
</div>
<figcaption>oik jQuery library embed</figcaption>
</figure>

Visiting the link in the iframe produces the expected result

I thought that the problem was that in the iframe tag the quotes around the parameters after the src= parameter had all been converted to HTML codes ”

[bobbingwide]

Filter functions attached to the_content when it doesn't work are:

: 0   bw_trace_parms;9 bw_trace_attached_hooks;9
: 1   oiksp_the_content;1
: 8   WP_Embed::run_shortcode;1 WP_Embed::autoembed;1
: 9   do_blocks;1 oik_do_shortcode;1
: 10   prepend_attachment;1 wp_filter_content_tags;1
: 11   capital_P_dangit;1 do_shortcode_earlier;1
: 20   convert_smilies;1
: 98   wptexturize_blocks;1
: 99   bw_wpautop;1
: 9999   bw_trace_results;9

and in sb/cwiccer, they look very much the same.

: 0   bw_trace_parms;9 bw_trace_attached_hooks;9
: 8   WP_Embed::run_shortcode;1 WP_Embed::autoembed;1
: 9   do_blocks;1 oik_do_shortcode;1
: 10   prepend_attachment;1 wp_filter_content_tags;1
: 11   capital_P_dangit;1 do_shortcode_earlier;1
: 20   convert_smilies;1
: 98   wptexturize_blocks;1
: 99   bw_wpautop;1
: 9999   bw_trace_results;9

Adding tracing to the results of the_content I could see that the content had been broken by wptexturize_blocks.
But also noted some unexpected content in the title= attribute.

where the title= parameter for the iframe in s.b/cwiccer was

title="“Pagey posts” — cwiccer

for s.b/oikcom it was

title="&#8220;oik jQuery library&#8221; &#8212; <span class="bw_oik"><abbr  title="OIK Information Kit">oik</abbr></span> plugins.com"

I suspected that the <span> and <abbr> tags were completely unexpected by wptexturize_blocks.

[bobbingwide]

But where was the text for this title coming from?
Answer: The Site Title for s.b/oikcom is [oik] plugins.com.
This is returned as part of the title= attribute in response to the embed request. See get_post_embed_html.
And this becomes part of the content that is
filtered by the filter functions attached to the_content.

The trouble is that the [oik] shortcode in the title is being expanded, producing the span, abbr and the unwanted quotes which messes up the iframe due when it's filtered by wptexturize_blocks.

[bobbingwide]

When oik-css is not activated the filter functions are different.

: 0   bw_trace_parms;9 bw_trace_attached_hooks;9
: 8   WP_Embed::run_shortcode;1 WP_Embed::autoembed;1
: 9   do_blocks;1 oik_do_shortcode;1
: 10   wptexturize;1 wpautop;1 shortcode_unautop;1 prepend_attachment;1 wp_filter_content_tags;1
: 11   capital_P_dangit;1 do_shortcode;1
: 20   convert_smilies;1
: 9999   bw_trace_results;9

So why isn't do_shortcode being invoked for [oik] ?
or why does do_shortcode_earlier expand the shortcode?

[bobbingwide]

So why isn't do_shortcode being invoked for [oik] ?
or why does do_shortcode_earlier expand the shortcode?

do_shortcode_earlier wasn't as complete as do_shortcode. I updated the oik-css function be like do_shortcode, but once again replacing the callback function do_shortcode_tag with do_shortcode_tag_earlier.

[bobbingwide]

Oik-css v1.1.0 is now available from wordpress.org and oik-plugins.com