How can I make PhpStorm warn me about deprecated HTML features? - html

I would like PhpStorm to warn me about deprecated features in my HTML code. At first, I thought this was somehow not working correctly when writing HTML code in PHP files, but now I tried it with an HTML-only file and there are still no warnings.
For reference, this is my test file:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<table width="123" frame="no"></table>
</body>
</html>
Both the width and frame attributes on the <table> tag are deprecated. However, PhpStorm inspections tell me "No problems found".
How can I enable warnings for deprecated HTML features?

It actually works .. but not for HTML5 as it has no schema in <doctype> tag.
https://youtrack.jetbrains.com/issue/WEB-16881 - -watch this ticket (star/vote/comment) to get notified on progress.

Related

Are HTML5 custom elements allowed in <HEAD>

I am trying to write some HTML5 standards compliant code, where certain scripts need to be run only after the user has consented to cookies.
The html code looks like this, where the consent-script element, works exactly the same as the script element, however holds off loading the script until the consent has been given.
<head>
<consent-script src="myscript.js"></consent-script>
</head>
Everything works fine in all browsers,
However when I attempt to validate this using https://validator.w3.org/ , the custom-element tag apparently closes the head section, and generates a pile of errors.
Looking at the specifications, I can't see any reason why custom-elements cant be used in the section. But I am not sure.
My question is, can HTML5 custom-elements be used in HEAD? If I can, then its a bug in the validator service. If not, then I will have to find another way of not running a script until the right moment.
Thanks.
EDIT. Further investigation (Thanks #Danny'365CSI'Engelman) leads me to believe that even a browser is moving the custom element out of the head section, into the body section.
Some mock up code:
The source is:
<!DOCTYPE html>
<html>
<head>
<my-custom-elem></my-custom-elem>
<!-- other tags in the HEAD -->
</head>
<body>this is the body
</body>
</html>
Yet, chrome developer tools gives me:
<html>
<head>
</head>
<body>
<my-custom-elem></my-custom-elem>
<!-- other tags in the HEAD -->
this is the body
</body></html>

Edge Developer Tools - href URL of the base tag called when using inline CSS

When using the HTML <base> tag together with the <style> tag with Microsofts Edge Browser I experience a very strange issue. Here is a very simple reproducer:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Edge dev tools base tag 403 reproducer</title>
<base href="http://netdata.ch/dt/pp/"/>
<style type="text/css">
</style>
</head>
<body>
Hello!
</body>
</html>
http://netdata.ch/dt/pp/reproducer.html
This page produces the following errors in the console/networking tabs when using the developer tools:
A direct invocation of http://netdata.ch/dt/pp/ DOES return a 403. But why does Edge call this URL when using the developer tools? All other browser don't. There is no 403 in the server access logs if developer tools are not involved. So this is ok.
However, if I remove the <style> tag the errors are gone:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Edge dev tools base tag 403 reproducer</title>
<base href="http://netdata.ch/dt/pp/"/>
</head>
<body>
Hello!
</body>
</html>
http://netdata.ch/dt/pp/ok.html
I could see this behaviour with:
Microsoft Edge 20.10240.16384.0
Microsoft Edge 38.14393.0.0
Any idea why this happens when the Edge developer tools are involved?
I would guess that Edge attempts to resolve images etc within the inline style tag from the base defined URL. as such it would need to resolve it for developer tools?

jsf 2 ui:include .html give error "XML Parsing Error: no element found"

I include a header.html (not .xhtml) to my page, but when I preview my page, it give me error "XML Parsing Error: no element found". I do know that it is the tag no properly closed issue, but since my header page is a html file, not a xhtml file, it shouldn't must close the tag, am I right?
If I do close all the meta tag in my header.html, my page is working fine, but I wish to know that is it a must close all the tag properly in html file if I include them in jsf2, thanks.
header.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Header</title>
<meta name="description" content="">
</head>
<body>header content</body>
</html>
welcome1.xhtml
<ui:include src="header.html" />
<p>welcome page</p>
From Oracle's documentation, <ui:include> is used to encapsulate and reuse content among multiple XHTML pages. The src attribute is expected to point to a well-formed XML document. Even if you want to include .html pages, you need to make sure all tags are closed properly.
If you look more closely, you will see the closing <html> tag in you header.html, which should end the HTML document, as you can see in Structure of an HTML document. This way, when you include the file in the final view you break that contract.
In JSF you'd be better off using the templating option of facelets. For example in a master template you can make insert points, like the scripts section, and later define inserted contents in template client pages (final views). Kickoff example can be found in this tutorial by mkyong.

Internet Explorer 9 compatibility mode

I have this HTML, valid for w3c:
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>COMUNE DI MILANO</title>
</head>
<body>
<h1>Ciao Mamma</h1>
</body>
</html>
I don't know why IE Switch to compatibility mode.
I found a meta tag that force the compatibility mode, but I want to know how to build a working HTML page..
Someone knows what will cause the switch? It could depends on Apache version / configuration?
Thank's a lot, Davide.
Try check the headers that are sent along with it, see if there's a X-UA-Compatible header that's set to something undesirable.

IE doesn't evaluate meta-refresh anymore after pressing F5

Ridiculous simple HTML-file:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="refresh" content="5; URL=./test.html">
</head>
<body>
<h1>Hello World</h1>
</body>
</html>
When I open the file with any browser, the browsers behave well and reload the page every 5 seconds.
But when I refresh the page manually between two refreshes (F5), the IE (V 8.0.6001.18702) doesn't evaluate the meta tag anymore and the page gets no longer refreshed. Opera, FF and Safari still work as expected and refresh every 5 seconds.
Has anybody else experienced such a problem? How (apart of using Javascript, of course) could this issue be solved?
Edit 1:
Verified this behavior also on IE6, so I guess it's a general IE problem. Any hints how to overcome this?
Edit 2:
To keep that topic going:
is that a known problem or would it
be worth to file a bug ticket
somewhere (where?)?
Could someone
verify that behavior with IE7 and/or
IE9?
In IE 9 it works fine.
P.S. you missed a few quotation marks should be:
<meta http-equiv="refresh" content="5;" URL="./test.html">
As far as i know theres only the mta or javascript way.
Another option might be to use
header("Location: url");
if you can use php, its not really a refresh in it common way, but you could use to redirect to the same page again
As with the meta way, did you tried to put a full url? ( IE, arrg )
Generally speaking, use of the non-standard META-REFRESH is frowned upon by the standards bodies. Having said that, did you try with a fully qualified URL instead of the relative URL? If you're trying to reload the same page over and over again, did you try omitting the URL entirely?
Use this, I suspect your URL is not setup correctly
<html>
<head>
<meta http-equiv="refresh" content="1">
</head>
<body>
</body>
</html>
This always refresh itself.
Hope helps
:)
Javascript is going to be your friend for this one... it ends up working a lot better across browsers for the most part. Besides, meta-refresh is going out of style.
The following script and body onload attribute will continuously refresh the page every 5 seconds.
<html>
<head>
<script>
function timedRefresh(timeoutPeriod) {
setTimeout("location.reload(true);",timeoutPeriod);
}
</script>
<noscript>
<meta http-equiv="refresh" content="5" />
</noscript>
</head>
<body onload="javascript:timedRefresh(5000)">
<!-- Content -->
</body>
</html>