Markup Transpilers - Custom and overrides

[alan-cole]

I'm looking to migrate a site from Ripple 1 to 2, and have a question relating to Markup Transpiler.

In Ripple 1, I have embedded a custom video and audio player component in WYSIWYG fields, and using /tide/tide.markup-plugins.js provided some transpilers to convert them into Vue Components. I also needed to patch out the default video transpiler (as otherwise it would be called twice).

Having a look into Ripple 2, I can see /ripple-tide-api/src/utils/markup-transpiler/default-plugins.ts provides some default transpilers, as well as ripple-tide-api/src/utils/mapping-utils.ts which will call these default transpilers in the getBody, and also allowing for custom plugins to be passed in the parameters as well.

However, since all WYSIWYGs (both existing and new) would require all these custom transpilers in the getBody, it would require a lot of overrides to chase up every usage.

Is there a better way to include additional custom transpilers, as well as override or disable default ones?

[dylankelly]

Hi @alan-cole ,

Thanks for raising this. IMO The markup plugins should be extendable from a project, its an oversight that it isn't able to be. We will add this as an item to our backlog.

But specifically regarding the audio element, this is something that is available in Tide Drupal so it should probably part of core (or if not removed from Tide). I think when this was first raised we were concerned about the fact that large audio files would need to be downloaded before the page would finish loading. It seems that this would be able to be addressed by setting the preload attribute https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio#preload to none or metadata.

I will also raise this internally on our roadmap to see if this is a feature we can add to core.