How to get rid of these code highlighters in WebStorm? - ide

How to get rid of the code highlighting on oi-options, ng-model etc.
I'm not sure what's the name of this option.

I've found out what the option is. It's "Unknown HTML tag". I think they've been highlighted due to the fact my HTML code has AngularJS functions in it. You can turn it off by going to
Settings > Editor > Inspections > HTML > Unknown HTML tag

Related

Karate UI: Locating text via CSS

I'm regularly hitting odd visible page text that karate cannot see, likely due to some funky JS magic that I don't fully understand.
Example image shows text on the page generated after clicking on a translate button:
I'm trying to assert that the translated text is present and correct on the page.
This is the selector:
#results-panel > div > div > div.thread > div > div.activity.panel.panel-default > div.panel-content > div > div:nth-child(2) > div:nth-child(1) > div > div.analysedText-translation > div > span:nth-child(3)
Example snippet of the element:
Using the wildcard {} or {^} doesn't work. eg waitFor('{^}A few random things about cats') returns a null
I played around with CSS selectors and am able to highlight the text using:
highlight('.analysedText-translation > div > span:nth-child(3)')[0]
I was thinking maybe using waitForText but not sure how to apply it. Any suggestions?
The reason the docs don't talk much about CSS selectors is that it is a standard. BTW this is open source, you are welcome to contribute pull-requests to improve the documentation.
UI automation is hard, I'm not going to claim that any framework makes it magically easier.
Suggestions:
if not already, start using the VS Code debugger, you can type things like highlight('div.panel-content') into the interactive console and play around with the page. see a video demo here (55:40) https://youtu.be/yu3uupBZyxc?t=3340
open the Chrome devtools console and type things like document.querySelector('div.panel-content') to see what gets matched
get a reference to any parent element and then you can "walk the tree": https://github.com/intuit/karate/tree/master/karate-core#tree-walking
If still stuck, follow this process so that we can fix anything in the framework if needed: https://github.com/intuit/karate/wiki/How-to-Submit-an-Issue

Broken syntax highlighting in WebStorm

I have some how changed how WebStorm sees the div tag. It looks like it is doing syntax highlighting for some language. Below is a screen shot of what it looks like. The file is saved as index.html and it is only the div tags that give the issue.
Any help would be great. I am not sure what other information would help, as I have no idea of what I did.
As per Iena's comment. The solution was to go into Settings | Editor | Language Injections and remove the div tag from the list.

vscode text coloring inside HTML script tag

I would like JS <script type="xx"> content to be colored nicely inside my HTML document.
Right now, when adding the type to a script tag, the element text becomes uniform white, as seen below.
Of course, the JS code is colored nicely within the HTML if removing the type attribute.
Is there some setting I can modify to make this work?
No setting to modify. This is a known issue. From the thread it looks like syntax highlighting was working at one point for script tags with the type attribute but was lost.
Hopefully it's fixed soon. I'm seeing the same thing on VSCode 1.13.1.

IntelliJ (IDEA/Webstorm) ignore/accept custom templating tags in HTML documents

I am using custom seperators/tags for template variables in HTML code. My tags are "{[{" "}]}". Can I make IntelliJ IDEA (or WebStorm) ignore completely what is inbetween them? If it matters, it is Go template language with custom tags.
Example :
<div title="{[{.T.T "error"}]}!"></div>
Gets marked as error because of the quotes inside the quotes. It also disables the ability for proper auto indentation or code formatting.
Another example, in this case JavaScript in an HTML document :
<script>
{[{if .Data.User}]}
var userData = {[{.Data.User}]};
{[{end}]}
</script>
This marks the quotes themselves as error.
I don't want IntelliJ to check the template code, just ignoring everything between the brackets would be enough.
No, you can't. IntelliJ IDEA builds a complete parse tree for the entire file, and it is not able to ignore arbitrary chunks of the file.
What you can do is either write a plugin that will be able to parse your template syntax, or change the syntax you use so that it matches more closely an existing template library already supported by IntelliJ IDEA.

Adding custom html tags to Intellij?

When I hover over a custom html tag that I'm using from a platform (Polymer) or even a custom one I made it says that you can mark such a tag as custom somewhere. Is there a place to do this in Intellij? I'm using the latest version (14).
Here is a screenshot of what I'm talking about:
Any help would be appreciated! It would be nice to get rid of all these error highlights when I'm working with Polymer. Thanks!
Place the caret over the highlighted tag, hit ALT+ENTER and select Add tag to custom tags.
However that works only for current project. If you want to set the ignored tags globally, try this:
Go to Settings/Inspections, find the Unknown HTML tag inspection, select the Default profile instead of Project Default and specify the tags separated by comma in the textfield in the bottom right corner. Here is a screenshot: