Created
November 7, 2017 11:56
-
-
Save undeadcat/3177081b47e3bd5c434a458ac95c6ce5 to your computer and use it in GitHub Desktop.
Intellij IDEA: Add css injection in <style></style> JSX tags
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Index: src/test/InjectionTest.kt | |
IDEA additional info: | |
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP | |
<+>UTF-8 | |
=================================================================== | |
--- src/test/InjectionTest.kt (revision 964b6e55da872b69a7609487eaa8e9a02af1c515) | |
+++ src/test/InjectionTest.kt (date 1510053653000) | |
@@ -132,9 +132,28 @@ | |
"div {color:EXTERNAL_FRAGMENT}") | |
} | |
+ fun testTemplateStringInJSXStyleTagBody() { | |
+ doTestWithExtension("const Button = (props) => (\n" + | |
+ " <button>\n" + | |
+ " {props.children}\n" + | |
+ " <style jsx someAttribute={'should not inject here'}>{`\n" + | |
+ " button { color: #999; }\n" + | |
+ " `}</style>\n" + | |
+ " </button>\n" + | |
+ ")", | |
+ "jsx", | |
+ arrayOf("\n" + | |
+ " button { color: #999; }\n" + | |
+ " ")) | |
+ } | |
+ | |
private fun doTest(fileContent: String, vararg expected: String) { | |
+ doTestWithExtension(fileContent, "es6", expected) | |
+ } | |
+ | |
+ private fun doTestWithExtension(fileContent: String, s: String, expected: Array<out String>) { | |
myFixture.setCaresAboutInjection(true) | |
- val file = myFixture.configureByText("dummy.es6", fileContent) | |
+ val file = myFixture.configureByText("dummy.$s", fileContent) | |
val injections = collectInjectedPsiContents(file) | |
Assert.assertEquals(expected.toList(), injections) | |
} | |
Index: src/main/kotlin/com/intellij/StyledComponents/StyledComponentsInjector.kt | |
IDEA additional info: | |
Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP | |
<+>UTF-8 | |
=================================================================== | |
--- src/main/kotlin/com/intellij/StyledComponents/StyledComponentsInjector.kt (revision 964b6e55da872b69a7609487eaa8e9a02af1c515) | |
+++ src/main/kotlin/com/intellij/StyledComponents/StyledComponentsInjector.kt (date 1510055363000) | |
@@ -2,16 +2,24 @@ | |
import com.intellij.lang.injection.MultiHostInjector | |
import com.intellij.lang.injection.MultiHostRegistrar | |
+import com.intellij.lang.javascript.psi.JSElement | |
+import com.intellij.lang.javascript.psi.JSEmbeddedContent | |
import com.intellij.lang.javascript.psi.JSExpression | |
+import com.intellij.lang.javascript.psi.JSFile | |
import com.intellij.lang.javascript.psi.ecma6.JSStringTemplateExpression | |
import com.intellij.openapi.util.Pair | |
import com.intellij.openapi.util.TextRange | |
+import com.intellij.openapi.util.text.StringUtil | |
import com.intellij.patterns.ElementPattern | |
+import com.intellij.patterns.PatternCondition | |
import com.intellij.patterns.PlatformPatterns | |
import com.intellij.psi.PsiElement | |
import com.intellij.psi.PsiFile | |
import com.intellij.psi.impl.source.tree.injected.MultiHostRegistrarImpl | |
import com.intellij.psi.impl.source.tree.injected.Place | |
+import com.intellij.psi.util.PsiTreeUtil | |
+import com.intellij.psi.xml.XmlTag | |
+import com.intellij.util.ProcessingContext | |
import org.jetbrains.plugins.less.LESSLanguage | |
class StyledComponentsInjector : MultiHostInjector { | |
@@ -25,8 +33,23 @@ | |
PlaceInfo(taggedTemplate(callExpression().withChild(withReferenceName("attrs"))), "div {", "}"), | |
PlaceInfo(taggedTemplate("css"), "div {", "}"), | |
PlaceInfo(taggedTemplate("injectGlobal")), | |
- PlaceInfo(taggedTemplate("keyframes"), "@keyframes foo {", "}") | |
+ PlaceInfo(taggedTemplate("keyframes"), "@keyframes foo {", "}"), | |
+ PlaceInfo(styledJsxTag()) | |
) | |
+ | |
+ private fun styledJsxTag(): ElementPattern<JSStringTemplateExpression> { | |
+ return PlatformPatterns.psiElement(JSStringTemplateExpression::class.java) | |
+ .withParent(PlatformPatterns.psiElement(JSEmbeddedContent::class.java) | |
+ .with(object : PatternCondition<JSEmbeddedContent>("jsxTagBody") { | |
+ override fun accepts(t: JSEmbeddedContent, context: ProcessingContext?): Boolean { | |
+ val tag = t.parent?.parent as? XmlTag | |
+ return tag != null | |
+ && PsiTreeUtil.getParentOfType(tag, JSElement::class.java) != null | |
+ && tag.name.equals("style", true) | |
+ && tag.getAttribute("jsx") != null | |
+ } | |
+ })) | |
+ } | |
} | |
override fun elementsToInjectIn(): MutableList<out Class<out PsiElement>> { |
Author
undeadcat
commented
Nov 7, 2017
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment