How add Vue syntax highlighting into JSP file - eclipse

I am using Vue in JSP files. The software is Eclipse STS. But JSP in JSP Editor, Vue syntax is not supported.
I tried Codemix plugin. But no go. Because Codemix supports only vue files, it seems. Any help would be appreciated.
<button #click = "frmSubmit()" type="submit" class="btn btn-info pull-right">확인</button>
#click or :href="this section should be highlighted,either"
but they are just treated as string or undefined attribute.

Supporting those as attribute names has simply not been asked for, at least in a JSP. They should be recognized in the upcoming March release with the resolution to https://bugs.eclipse.org/543994 . A plug-in being able to assume responsibility for syntax coloring those attribute's values would take longer, but there's no solution for it yet, nor a feature request to work out how to do it.

Related

keycloak translation / message with link should open in new Tab

I would like to have a translation in my messages_en.properties containing a link, which opens in a new tab. Is there a way to do this?
I already tried to add
<a target="_blank" href="http://example.com">Example</a>
and
<a href="#" onclick='window.open("http://example.com");return false;'>Example</a>
without success.
Thanks in advance
Most likely your HTML isn't working because of kcSanitize in the template file. Wherever HTML messages are allowed, Keycloak's FreeMarker templates will also wrap the text with this method which:
Allows sanitizing of html that uses Freemarker ?no_esc. This way, html
can be allowed but it is still cleaned up for safety. Tags and
attributes deemed unsafe will be stripped out.
The no_esc allows HTML to render (by not being escaped) but the kcSanitize strips unsafe tags and attributes first. In my testing, I found that "target" and "onclick" are stripped out.
One way that works but that I wouldn't recommend for safety is removing the kcSanitize() around where your message displays in the corresponding .ftl file.
Another idea is adding an id or class to the element in your .properties file and using custom Javascript to set the target="_blank" attribute.

How to get code assist for HTML tag class attribute in Eclipse?

I am using STS for Spring application developement. I want to use Bootstrap CSS on frontend.
The problem is that code assist does not work for css classes (JetBrains PHPStorm is doing it just fine)
So when I type
<button class="|
I would like to Ctrl+Space to get list of all available css classes (obviously fetched from CSS files in project).
How can I do this?? Code assist for tags and tag attributes works, but what about class attribute value?
Required feature comes with plugin wtp-web-resources but it has some bugs and is no longer maintained because it was supposed to be merged into WTP as core feature and its not done yet.

Handlebars formatting in NetBeans

I'm using NetBeans as my IDE for a Ember.js project. When I create handlebars templates in my app like below the code highlighting doesn't work correctly.
<script type="text/x-handlebars">
<div>
</div>
</script>
Normally, when I'd select the first div, it and its matching end tag would highlight yellow, but this doesn't work. Since its inside the handlebars script tag both are highlighted red as errors and don't match together. This makes writing complex templates kinda annoying as it can be difficult to pinpoint syntax errors.
Is there anyway to get NetBeans to highlight inside the handlebars tag as if its regular html?
One option, until Netbeans implements this enhancement, is to add the following script tag in index.html immediately after your reference to jQuery:
<script src="js/libs/jquery.js"></script>
<!-- use following line to change script type to 'text/x-handlebars' -->
<script>jQuery('script[type="text/html"]').attr('type', 'text/x-handlebars');</script>
This is a variation of the answer provided by GCoda.
I had the same problem and tried various non satisfying fixes.
In the end I figured the best solution is simply to change the script's type attribute to text/html:
<script type="text/html">
<div>
</div>
</script>
I got same problem. And i just used a some kind of postprocessing, i am using node.js, so i did res.send(data.replace(/type="text\/html"/g,'type="text/x-handlebars"')); on my / page.
I think you can do something similar in you language, and ofcource this is not a fix, just an ugly trick to make developing more easy. Dont keep it in production.

HTML comment tag <!-- --> Removed in CQ5

I'm using Rich Text Editor with MiscTools plugin to edit text in CQ%
However when I open the HTML editor and create sth like this
<div id="test">Test <!-- Test Comment --></div>
the CQ rewrites it to after switch back to HTML mode and source edit mode
<div id="test">Test </div>
Is it possible to keep HTML comment tag <!-- --> in the source code?
Thank you for answer my question
I would suggest taking it out of the div and see if that works.
In CQ5.4-5.6.1 (not sure about latest version AEM6), the Rich Text Editor intentionally strips out all HTML comments. The only way to stop it from doing this is to modify the product javascript source code in WhitespaceProcessor.js. However, allowing HTML comments in this way wouldn't be recommended as it hasn't been fully tested it might cause other errors. If you still need this feature, then you might consider contacting Adobe Customer Care to request it to be officially added to the product.

Warnings of valid HTML5 attributes in Eclipse

I use Eclipse and I write jsp files with HTML5 content.
So I have for example this line:
<div class="test" data-role="test123">
In Eclipse I get the warning:
Undefined attribute name (data-role)
What needed to be done so these warnings won't appear anymore? In HTML5 this attribute is allowed (data-*) as you can see here: http://ejohn.org/blog/html-5-data-attributes/
It seems like Eclipse still has some problems validating HTML5 elements and attributes even now.
I'm running Mars 4.5.1 and I have had warnings about the <main> element, despite the fact that there are no warnings about the <section> element.
But there is a solution!
Window > Preferences > Web > HTML Files > Validation
Here you can tick the Ignore specified element names in validation checkbox and enter the names of any elements which Eclipse is incorrectly warning you about.
In your case, you will want to tick the Ignore specified attribute names in validation checkbox and enter the data-role attribute.
After you click 'Apply', Eclipse will ask you to do a full validation of the project. Select 'Yes' and the changes will take effect.
No more squiggly yellow lines YAY! :D
Your doctype
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
is for HTML 4.01.
data-* attributes were added in HTML 5. The doctype for HTML 5 is basically either
<!DOCTYPE html SYSTEM "about:legacy-compat">
or
<!DOCTYPE html>
Newer versions of Eclipse support HTML5 tags and the data-* attributes allowed in HTML5. However, when using the role attribute the proper syntax according to the ARIA Roles Model and XHTML Role Attribute Module is not to prefix the role attribute with data-* leaving just role and not data-role.
So <ul role="menubar"> is more correct than <ul data-role="menubar">. The validity of the syntax can be checked using the (X)HTML5 Validator. jQuery Mobile uses quite extensively the data-role attribute, though I'm not sure why.
Note: If you upgrade and you're still getting warnings on data-* attributes you may want to consider updating or removing any installed syntax-checkers such as JTidy. As of Indigo Service Release 1 the role attribute continues to trigger an undefined attribute warning in Eclipse by default.
I used this one with Aptana 3.6 when I'am coding AngularJS
Window > Preferences
I use the Aptana Studio plugin on Mac OS X; if I go Eclipse > Preferences > Aptana Studio > Validation > HTML, and create the filter *data-role* I no longer get this warning.
I believe on Windows it is Window > Preferences > Aptana Studio > Validation > HTML
Eclipse 3.6 introduced a new field under:
Validation -> HTML Syntax: Ignore specified attribute names in validation
Add the OpenGraph, RDFa or other non-HTML5 attributes you want the validator to ignore:
You will need to re-validate the project, then the warnings will be gone.
Eclipse observes the DOCTYPE declaration. In my case, the solution was using the code above at the first line of the files containing HTML code:
<!DOCTYPE html>
Related to that, there's this other question, already answered:
Why do we need DOCTYPE to the HTML/JSP pages?