Extension for New Embed Type Doesn't Show correctly in Lists widgets

I implemented a new Embed type to use in the TinyMCE editor to support our Communications group who wanted to assign a specific image as the Poster image for their videos. This was based on the conversation in this thread. https://community.telligent.com/community/10/f/ask-the-community/1145485/htmlsanitation-in-10-1. The extension works just as planned. It allows them to enter a URL to their video, a URL to their poster image and the size they want their video displayed. The output of the extension is the standard HTML5 <video> code using their poster image.

The one issue I have noted is that this embed extension is not displayed correctly when the item is displayed in the Activity Story Stream or the Blog - Post List widgets. The <video> and <source> tags have been scrubbed from the output, leaving only the alternative text that was inside the <video> tag for browsers that do not support HTML5 <video> tags. 

I also created what is essentially an identical extension for embedding <audio> into the TinyMCE. Same thing here. It displays fine in the post itself, but only shows the alternative text with the <audio> and <source> tags scrubbed from the output when it shows up in the Activity Story Stream or Blog - Post List widgets. 

Is there something I missed in the implementation? Or there something that needs to be done in those widgets? Or ...

  • You may want to review the Filtering settings for your site and content types to ensure the embeddable is allowed and the tags being scrubbed are allowed.

    Administration > Moderation > Filtering for the site level Filtering options

    Administration > Applications > Content for the filtering that is specific to each type of content

  • Embedding has everything listed allowed which includes Embed code as well as MP3 and MP4 content, which makes sense considering that in the post display where the content was added, the embedded content shows up exactly as planned. It is not being filtered globally or I wouldn't expect it to show up there either. 

    Everything is also checked/allowed in the formatting section. I think this section is the reason I ended up doing the extension. In 8.5 I added all of the tags needed to the HTML Sanitation section of the community-override.config so we could just paste in our own <video> and <audio> right into the source of the TinyMCE editor. The ability to add that is not there in 10. So I would be interested in what the coding would look like to add my extra tags into this section if you could point me to an example of that. 

    But on the side, I have been taking a closer look at things. The examples of videos that show up in the lists were all "uploaded" video content. The "remote" video content is only displaying a link to the content. I am not sure I understand that difference either. But maybe my expectations are wrong. I am not sure. 

    At any rate, could you point me to an example of code that would allow me to add a new Formatting type to the Moderation > Filtering section? I would love to be able to continue supporting the pasting in of the video tags straight into the TinyMCE Source editor. Particularly the coding that is already there in posts from 8.5.

  • 1. Regarding the removal of video from the activity stream

    Most activity story renderings in 10.x use a new truncation method that removes some HTML to generate the resulting summary. What is removed is hard-coded and, when truncation occurs in the middle of an embedded item, the embedded item will be removed. In cases where an embedded file is still rendered, its likely that the embedded file's code is completely within the accepted truncation length.

    Rendering of each activity story is controlled by widgets in 10.x and individual stories can be edited within Widget Studio to enable, optionally, full rendering of content.

    2. Support new formatting types

    This is not currently an extensibility point. Raw video and audio tags are never allowed because browsers will edit those tags (and potentially remove them) if the source content is not supported by the browser. So what will embed in browser A may be removed by browser B just by editing the content. Instead, embeddable content fragment types should be used to insert metadata that can be resolved at render time.

  • The support for additional formatting types is just reiterating what you had told me in the previous post. So to exercise you twice on that one point. 

    The <video> code I am inserting has some embedded content between the opening and closing video tags that will not be removed by browsers that can't process the HTML5 video tag content itself. What I am seeing in the Activity or Blog Post List is the extra encapsulated content without the surrounding code. Based on the truncation methodology, if the video was dropped due to truncation that content should have been removed as well, since it is contained. 

    I am not seeing the connection between the Activity Story and how that is controlled by the widgets. You're implying that, for example, the Blog content displayed in the Activity Story Stream is actually controlled by the Blog Details widget? Or the Forum story is controlled by the Forum Thread widget? I have heard that the Group Email Digest is controlled by the Activity Story Stream too. Which would tie it all together. It sounds good. I just don't see how. 

    I appreciate your patience. :-)

  • In Widget Studio, in the Viewing drop down you will a section of Activity Story Types widgets.  Those are the widgets that control the display of content in an activity story.

    Is your extension working in the activity stream for other content types,?  Or is it not working in any content type in the activity stream?

  • Thank you for that. I hadn't seen those "hidden" widgets. I have some more looking to do before I can answer your question. But this gives me a better Idea of where to start looking for the Activity Story Stream. 

  • if the video was dropped due to truncation that content should have been removed as well, since it is contained. 

    With your legacy video content where the raw HTML is part of the post content, the truncation process will remove the video element during HTML sanitization. When we truncate HTML content and preserve HTML, we process the truncated result through our HTML sanitization logic to ensure that the resulting truncated HTML is still valid HTML. In that process, the video tag will be removed because it is not allowed by our HTML sanitizer, but we've also configured the sanitizer to not remove child content for video/audio elements (since that inner content is the fallback for browsers not supporting audio/video).

  • I did a little testing late yesterday. Pointing me to the Activity Stream widgets helped a lot. (Thanks Matthew) I had not noticed them before. (An aside: Are the control panel elements also available? I was asked about adding wording to the "Revert" links.)

    The testing showed just what you are saying. It was only the video and source stuff that was being sanitized and the inner content was being retained. Thinking about that a little I believe I have a solution, or workaround that will be acceptable. 

    Corrected: I only initially looked at this with Forum posts and need to look at a lot more use cases, but I noticed one thing that seems odd. If I use the builtin Insert Media, the display in Activity Stream is different depending on whether I choose Upload or use a Web URL. If you upload the video there is no indication there was a video. However if you choose the URL option a MediaType icon is displayed in its place with a link to the video. Where I had previously said the video was displayed was a different case ... a video attached to a blog post.

    I need to spend more time looking at the widget code to get a better understanding of what it is doing. And then spend some time on the other widgets for the Activity Stream. So much to learn.