VSCode: prevent custom snippets from being suggested in wrong place in HTML - html

I have several custom HTML snippets for pieces of boilerplate HTML code I use often.
There are intended to be inserted somewhere in the DOM, such as a DIV.
However, they are being suggested when inside the quotes of an HTML attribute — where they can't be used — pushing down valid attribute selections.
How can I prevent this or, if not, disable intellisense for my HTML snippets altogether?

Related

Mechanical Turk Failure to Parse HTML - how best to check it?

When trying a test batch of a simple HIT, I discovered that the submit button does not work. I then noticed that when looking at the Layout ID it says that
There was an error parsing the HTML5 data in your hit template.
This was just a quickie HIT that I built by hand based on an existing template, but I figure I must have messed up the HTML somewhere since I was editing it by hand.
When I try to copy/paste the source of my HIT into the W3 validator, the things it complains about are not parts of the template that I touched, and mostly seems to be about the fact that my source is not a complete HTML document because MTurk will be wrapping it:
Warning: Consider adding a lang attribute to the html start tag to declare the language of this document.
Error: Start tag seen without seeing a doctype first. Expected .
Error: Element head is missing a required instance of child element title.
Warning: The type attribute for the style element is not needed and should be omitted.
Is there an easy way to access the full wrapped HTML of the HIT for validation? Or some better way of troubleshooting my HTML.
You're correct that MTurk will wrap the HTML you provide. You can see the boilerplate XML it will add on the documentation for HTMLQuestion. These docs are intended for developers using the API, but it will show you what's happening with your HTML.
That said, it shouldn't matter. Just make valid HTML and you'll be okay. For example, the <title> tag won't be shown when Workers do your task, but leaving it in won't harm anything.
Also, a common mistake is to omit <!DOCTYPE html> on the first line. It's required as part of the HTML spec, but browsers aren't strict about it, so most people don't do it. But MTurk, and the W3 Validator, will both bark at you if you omit it.

Which inline HTML styles does GitHub Markdown accept?

This gives a pretty thorough description of how HTML elements are interpreted by Markdown. But it does not discuss styles.
So far, the only thing I can get to work is image width.
I can't find a list anywhere of what is accepted/rendered
It appears that the style="....." attribute is completely ignored.
I can't even find a list of the old-fashioned style attributes (as opposed to the style attribute style=...)
https://gist.github.com/abalter/46df1b79e9f429342972477d7c20cebc
Change span to div due to div being in the whitelisted tags per #waylan's comment under #chris's answer.
It appears that Firefox and Chrome don't render any style attributes any more at all.
After GitHub converts Markdown to HTML,
The HTML is sanitized, aggressively removing things that could harm you and your kin—such as script tags, inline-styles, and class or id attributes. See the sanitization filter for the full whitelist.
You're right: style tags are not included in the whitelist. They are ignored.
The permitted attributes differ by tag. I recommend referring to the sanitization filter link above. It leads to a fairly readable Ruby source file.

Non formatting tags outside html tag

I have a rather bizarre usecase.
I need a tag on top of a html document that will not be used in formatting but that will contain some information for the parsing entity to act upon (flags & data).
Normally comments are used for this:
<!-- foo = bar -->
<html>
etc.
Now we can strip 'foo' from the comment when the html is parsed and act upon its value 'bar'.
However I am now in the situation that one of the intermediate systems strips all comments from the html as it sends it along.
So my question is: What other tags can go outside of the html tag without breaking the html specs (too much)?
I know of the <!doctype> tag, but you cannot really put in data there without breaking something
NB:
yes, I know this kind of signalling is ugly, but these are not my systems, I must provide such a flag.
all comments are stripped
js is not executed (yet) so we cant do it via the dom
This is a less than ideal situation but you can add anything inside the doctype tag like this:
<!doctype html public 'You are free to add anything here'>
I'm not sure how much data is allowed in there but this shouldn't mess with the parsing of the page.

Encapsulate the rendering of HTML

Can someone explain me what it means when they say:
"HTML Helpers enables to encapsulate the rendering of HTML"
Does it mean it will restrict access to the HTML attributes of an object? What if I am using CSS, jquery, Javascript, will it display my JS/jquery and CSS in page source?
HTML helpers are bits of code that will render out the HTML, instead of you writing out the HTML for each and every piece of data directly in the view.
They encapsulate it - meaning they take care of what HTML is output.
By "encapsulating the rendering", they are referring to the encapsulation of the functionality of rendering html.
If there is a common piece of html you render often, (the rails form helpers for example), if you insert the code (or the code building functionality within a helper), each time you need to render that html (or a variant of it) , you merely call the helper method thereby keeping your code "dry" (html code in this case)

Today's Google Doodle of Moog Synthesizer

I was inspecting today's Google Doodle of Moog Synth, dedicated to Robert Moog,
when I came across the following piece of html code:
<w id=moogk0></w>
<s id=moogk1></s>
<w id=moogk2></w>
<s id=moogk3></s>
(You can view the source & do a Ctrl+F for , you will get it in the first search result).
I googled about s & w tags but found nothing useful except that the s tag is sometimes used to strikeout text but is now deprecated.
Obviously google will not be using deprecated tags but I guess there's a lot more behind this than plain html code. Can anybody explain me the use of this tags? & how does the browser recognise them? & if the browser does not recognise them, whats their use?
The browser doesn't recognise them.
But HTML was designed to ignore what it doesn't recognise, so these are simply not understood by the browser and get ignored. As elements without content, they will not get rendered at all either, though they will be part of the DOM.
However, these can be styled directly as elements in CSS and picked up by Javascript (getElementsByTagName and getElementById etc...).
In short, these elements provide a target for CSS and Javascript without any other impact on display.
Unknown elements are treated as block elements (like div) and can be styled accordingly and be used in scripts.
The tags you are talking about are user created XML tags.
If you need to display dynamic data in your HTML document, it will take a lot of work to edit the HTML each time
the data changes.
With XML, data can be stored in separate XML files. This way you can concentrate on using HTML/CSS for display and layout, and be sure that
changes in the underlying data will
not require any changes to the HTML.
With a few lines of JavaScript code,
you can read an external XML file and
update the data content of your web
page.