Disable an injection into HTML from another plugin

IntelliJ Platform
1

I have a custom language that is an extension of HTML. One of the features is to allow the injection of ruby code in HTML attributes beginning with “:” for certain tags, e.g.:

<x-abc :title="this is ruby code"/>

However, currently the default Vue plugin is injecting JavaScript into these attributes.

  1. How can I disable the Vue injection? Preferably just for certain tags.
  2. Is there an easy way to add an injection into XML attributes without needing a lexer?
  3. Is it possible to re-enable the Vue injection if there are two colons, ::?

I’ve been looking into extension points, but I’ve only found names, and no descriptions of what they do.

2

Asked ChatGPT and it gave the answer immediately!

I wrote a MultiHostIniector to inject Ruby into those attributes:

class MyRubyAttributeInjector : MultiHostInjector {
    override fun getLanguagesToInject(registrar: MultiHostRegistrar, context: PsiElement) {
        if (context is XmlAttributeValue) {
            val parent = context.parent as? XmlAttribute ?: return
            val tag = parent.parent as? XmlTag ?: return
            if (tag.name == "x-abc" && parent.name.startsWith(":") && !parent.name.startsWith("::")) {
                registrar.startInjecting(RubyLanguage.INSTANCE)
                    .addPlace(null, null, context, TextRange(1, context.textLength - 1))
                    .doneInjecting()
            }
        }
    }

    override fun elementsToInjectIn() = listOf(XmlAttributeValue::class.java)
}

And added it to my plugin with order set to first to prevent Vue injecting:

<extension point="com.intellij.multiHostInjector">
  <multiHostInjector implementation="your.package.MyRubyAttributeInjector" order="first"/>
</extension>
3

More specifically, this change:

1 Like