textmate / html.tmbundle Goto Github PK

TextMate support for HTML

Ruby 73.92% HTML 26.08%

html.tmbundle's Introduction

Installation

You can install this bundle in TextMate by opening the preferences and going to the bundles tab. After installation it will be automatically updated for you.

General

Bundle Styleguide — before you make changes
Commit Styleguide — before you send a pull request
Writing Bug Reports — before you report an issue

License

If not otherwise specified (see below), files in this repository fall under the following license:

Permission to copy, use, modify, sell and distribute this
software is granted. This software is provided "as is" without
express or implied warranty, and with no claim as to its
suitability for any purpose.

An exception is made for files in readable text which contain their own license information, or files where an accompanying file exists (in the same directory) with a “-license” suffix added to the base-name name of the original file, and an extension of txt, html, or similar. For example “tidy” is accompanied by “tidy-license.txt”.

html.tmbundle's People

Contributors

Stargazers

Watchers

html.tmbundle's Issues

Support for text/paperscript in html.json

Similar Issue re text/babel : microsoft/vscode#11781 can you please add text/paperscript to the html.json to support syntax highlighting for paper.js in VSCode.

I have applied locally and everything appears to work satisfactorily.

Image drag command broken for case sensitive file systems

Commit 81235ef introduced a rewritten drag command for images, this requires CGI in uppercase which fails for case sensitive file systems (should be all lowercase).

Html script closing-tag not detected when occurs immediately after 2 slashes

Hi, I found a bug, with the html grammar in VS Code, when you place a closing script-tag in the same line immediately after 2 fwd slashes, as:
<script> //</script>
the grammar will not detect the closing tag, and will display it with wrong color, see images.

(I'm not sure if the issue is related only to vscode-textmate, or it belongs to textmate/html.tmbundle).

VS Code:

Visual Studio 2015:

VSCode Version: Code 1.13.1 (379d2efb5539b09112c793d3d9a413017d736f89, 2017-06-14T18:21:47.485Z)
OS Version: Windows_NT ia32 10.0.15063

Steps to Reproduce:

Open any html document with VSCode.
Insert a script element in the document, and place the script's closing-tag immediately after 2 fwd slashes.

Insert Close Tag: too big quantifier in {,}

I work with very big XML files (+43k lines). The Insert Close Tag command fails in these documents with the following error

Insert Close Tag:18: too big quantifier in {,}: /(.*\n){43881}.{4}/ (RegexpError)

It looks like rails supports this quantifier up to about 32k lines. I tried to chop of the first lines of the document, but it looks like this fails because of the way the remaining document is scanned.

I think this has to be rewritten, to scan for open tags beginning from the end of the document until it finds the first tag that is not closed already.

Character "<" (Less-Than sign) color becoming red incorrectly on HTML document comment sections

From @SDP190 on May 11, 2017 22:57

When i place a script tag in an html document, and then write two forward slashes to comment out the following line, if i'll then type the "<" (Less-Than sign) character on that line, as:
<script> //<
</script>
it becomes red in the VS Code Editor, instead of being green as usual with comments on javascript code.
first I thought that the reason is because "<" character is illegally used in a script tag since this may indicate the starting of a closing-tag, but when I try it in other IDEs they don't give me any error, and I believe that they are right.
Now I realized that the same problem occurs even with the script closing-tag itself, if it is placed right after the two fwd slashes, as:
<script>
//</script>
in the latter scenario the "<" character of the closing-tag becomes red.

See image:

VSCode Version: Code 1.12.1 (commit: f6868fce3eeb16663840eb82123369dec6077a9b)
OS Version: Windows 10 (x64)

Update:
another issue i found is with "&" character (Ampersand sign), becoming red incorrectly, see image:

Copied from original issue: microsoft/vscode#26495

canceling "insert entity" results in error dialog

after clicking "cancel" from the "insert entity" panel, textmate shows the error "Failure running “Insert Entity…”. Command returned status code 1."

Syntax highlighting fails when a html tag is inside a data attribute

From @rohinrohin on June 26, 2017 14:6

VSCode Version: Code 1.13.1 (379d2efb5539b09112c793d3d9a413017d736f89, 2017-06-14T18:18:03.540Z)
OS Version: Linux x64 4.8.0-56-generic
Extensions:

Extension	Author	Version
theme-dracula	dracula-theme	2.1.2
hopscotch	idleberg	0.1.4

Steps to Reproduce:

Make a new html document
Paste the following html code into the editor

<!DOCTYPE html>
<html>
<body>
    <p>This is a paragraph</p>
    <input data-on="<i class='fa fa-play'></i>"/>
    <p> This is also a paragraph </p>
</body>
</html>

You can see from the image above that syntax does not highlight correctly when you have have an html tag inside a data attribute. This is a valid statement as per the HTML 5 reference:

Except where otherwise specified, attributes on HTML elements may have any string value, including the empty string. Except where explicitly stated, there is no restriction on what text can be specified in such attributes.

It works when the charectars are escaped like:
<input data-on="<i class="fa fa-play"></i>"/>

Copied from original issue: microsoft/vscode#29461

Dashes in HTML comments should not be highlighted as an error

Example:

```html
<!--------------------------------->
```

<!--------------------------------->

should be without error syntax highlight; see whatwg/html#1351

See whatwg/html#1356 (comment) for test cases

(originally filed at github-linguist/linguist#3232 )

insert entity panel should open with keyboard focus in "search entities" text field

when opening the "insert entity" panel, keyboard focus should be in the "search entities" text field enabling the user to search for an entity without first clicking in the search box.

Any plans to highlight angularjs 1.x syntax in html?

In visual studio when you have angular1.x attributes like ng-show="" or others similar the attributes are highlighted with a orange/pink color, as well as the mustache bindings like {{myModel.someProp}}.

Just like in VisualStudio, I hope this feature could be implemented in VSCode.

I wish I was working with angular2/4 already but my company is stuck with 1.x for the long run.
Thanks

W3C Validation no longer works

W3C updated their HTML so that the form parameters has changed.

Steps to reproduce

New From Template → HTML → HTML 4.01 Strict
⌃⇧V

Expected Result

Validation info for the HTML document.

Actual Result

A page asking for a file upload.

Tag names may contain hyphens

e.g. <font-face> from svg, and all custom elements have hyphens in their tag names.

Treat script type="module" as JavaScript

From: microsoft/vscode#25760

<script type="module"> was recently added to the html specification and is being used by various frameworks. Script blocks using type="module" are currently not highlighted

I'll submit a PR shortly with the fix

XHTML-style closing tag should be scoped as closing tag punctuation

VSCode Version: Code - Insiders 1.10.0-insider (1d17b45a11d8db22fe95c601f793a3cb9a582ba6, 2017-02-14T09:43:26.020Z)
OS Version: Darwin x64 16.4.0
Extensions:

Extension	Author	Version
code-settings-sync	Shan	2.4.3
sort-lines	Tyriar	1.2.0
html-css-class-completion	Zignd	1.0.3
Bookmarks	alefragnani	0.11.0
project-manager	alefragnani	0.13.2
vscode-eslint	dbaeumer	1.2.6
python	donjayamanne	0.5.8
tslint	eg2	0.8.1
angular2	johnpapa	2.0.1
vscode-icon-theme	jtlowe	1.4.0
theme-karyfoundation-themes	karyfoundation	11.0.0
restructuredtext	lextudio	0.0.21
HTMLHint	mkaufman	0.3.3
vscode-autoprefixer	mrmlnc	2.0.0
vscode-stylefmt	mrmlnc	2.2.2
stylelint	shinnn	0.22.0
darcula-extended	smlombardi	3.3.2
slime	smlombardi	1.0.5
theme-tesla	smlombardi	6.0.0
change-case	wmaurer	1.0.0

Steps to Reproduce:

When using a tag that still requires an XHTML-style unary closing tag />, the / should be scoped to match the closing >.

As you can see, it's not, so all the / are white while all other punctuation.definition.tag.end.html are a different color:

script type="module" doesn't highlights as javascript

From @nicolasparada on May 2, 2017 7:27

VSCode Version: 1.12.0-insider
OS Version: Windows 10 15063.250

<script type="module"></script>

Scripts of type "module" on .html files are not getting correctly highlighted. They just shows as plain text I guess...

Copied from original issue: microsoft/vscode#25760

Angular ngif less than syntax highlighting

From @mterczynski on July 17, 2017 23:41

"Greater than" works fine:

Copied from original issue: microsoft/vscode#30891

Latest release on longer recognizes the content of script element with type="text/html" as html

From @dancvogel on May 4, 2017 18:59

VSCode Version: Code 1.12.0 (72672be0b7d3eef0784077b880615f91b7ec85aa, 2017-05-04T16:18:34.633Z)
OS Version: Windows_NT ia32 10.0.14393
Extensions:

Extension	Author	Version
code-beautifier	michelemelluso	1.7.2

Latest release on longer recognizes the content of script element with type="text/html" as html. It's now coloring the entire block as a single color and not a different color for the element name, and for attribute, and for attribute value.

Steps to Reproduce:

Copied from original issue: microsoft/vscode#25920

HTML Comment indentation

When an open tag is followed by a comment on a line, the following line is not correctly indented.
Example:

<div>
<!-- comment -->
<div>
...

should be

<div>
  <!-- comment -->
  <div>

or at least

<div>
<!-- comment -->
  <div>

Inserting SWF into HTML

When trying to drag a Flash (swf) file into a HTML document opened in TextMate I end up having this error:

/tmp/temp_textmate.eXe7kS:75:in /bin/bash: -c: line 0: unexpected EOF while looking for matching `''
/bin/bash: -c: line 1: syntax error: unexpected end of file>>' for nil:NilClass (NoMethodError)
  from /tmp/temp_textmate.eXe7kS:61:in /bin/bash: -c: line 0: unexpected EOF while looking for matching `''
/bin/bash: -c: line 2: syntax error: unexpected end of filenew'
  from /tmp/temp_textmate.eXe7kS:99

Hope you can give me a hint on this.

Cheers

how does the html bundle preview a document with unsaved changes?

This is a question I posed on the textmate list ... I thought perhaps posting a copy here might be better.

I'm trying to add the ability to the jshint.tmbundle bundle to run jshint on a document which has changes that haven't been saved to the filesystem.

https://github.com/fgnass/jshint.tmbundle

Currently the jshint bundle will do this on Save and if there are jshint errors it will display these in an html window.

I started looking at other bundles which do something similar and checked out the Preview command in html.tmbundle and noticed that if I saved a file, added some text and ran Preview without saving again --- the preview showed the new html content.

The code in the "Show Web Preview": command is pretty simple but it's not at all clear to me how it works to accomplish this:

https://github.com/textmate/html.tmbundle/blob/master/Commands/Show%20Web%20Preview.tmCommand#L9-L12

#!/bin/sh
if [[ -e "$TM_FILEPATH" ]]; then
echo "&lt;base href=\"file://$TM_FILEPATH\"&gt;"
fi
cat

How did the content I added but hadn't yet saved get to the web preview window?

Thanks for any tips!

"Refresh Running Browser(s)" fails silently

This script requires that "Allow Javascript from Apple Script" to be enable under the Develop menu in Safari on OS X El Captain.

If ran in the terminal the following error is shown:

Refresh Running Browsers.scptd/: execution error: Safari got an error: You must enable the 'Allow JavaScript from Apple Events' option in Safari's Develop menu to use 'do JavaScript'. (8)

It would be nice to report this to the user.

Unquoted id attribute values still not working

This commit (Syntaxes/HTML.plist) should allow unquoted attribute values, but for id attributes, unquoted values still break parsing. <key>tag-id-attribute</key> seems to be the problem.

Insert Close Tag error

Textmate Version 1.5.10 (1623), Mac OS X 10.7.2

Insert Close Tag function doesn't work. Tried reinstall, delete all custom plugins, delete/tmp/temp_textmate*, etc..

this is what I get when I press alt-cmd-. or select it from Bundles menu:

/tmp/temp_textmate.nyIFNL:12:in `match': invalid byte sequence in US-ASCII (ArgumentError) from /tmp/temp_textmate.nyIFNL:12:in`

All other functions work fine...

HTML `=` punctuation scoped as text

OS X version: 10.10.3
TextMate version: 2.0b7.1
The (code) language you’re working in: HTML in TWIG

The = in class="class-name" has a scope of meta.tag.inline.any.html when it would seem that punctuation.something is more appropriate.

Invalid syntax highlighing of  in .html file

From @luqimin on September 7, 2017 14:44

as mentioned in the title..

Copied from original issue: microsoft/vscode#33944

Remove entity higlights from tag attributes

The example below shows two examples of both red and blue highlights, one pair in the attribute values, one pair between the tags. The highlights in the attribute value should be removed.

<a href="?x=y&a=b&amp;c">x & y &amp; z</a>

This is different from entities in comments, that might be temporarily switched off code, I won't meddle with that discussion.

HTML custom tag has wrong color when name partially overlaps with standard tag

From @BrainCrumbz on May 5, 2017 14:31

VSCode Version: 1.12.1
OS Version: Win 10 Version 1703 64b

Steps to Reproduce:

create an HTML (Angular template) file
type a custom component tag, whose name starts with a known standard HTML tag, e.g. some <form-field> tag.

Exptected

<form-field> should all be formatted in one color, the same applied to HTML standard tags.

Actual

<form half has same color as standard tag, while the rest, -field>, is colored as an attribute:

Copied from original issue: microsoft/vscode#26043

Highlight error

From @cpa-level-it on April 28, 2017 7:24

I discovered an error with the syntax highlighting of HTML code.
If we have a custom tag that starts with script followed by a dash ex <script-module>. The text after the script part will be highlighted in red and the rest of the file will not be correctly highlighted.

See this screenshot

<split-pane-container>
  <script-module></script-module>
</split-pane-container>

Steps to Reproduce:

Type in a tag that starts with script followed by a dash eg <script-module></script-module>
The file isn't correctly highlighted

Copied from original issue: microsoft/vscode-html-languageservice#10

All script tags are treated as JavaScript

Script tags are used for other things too (Dojo, AngularJS). The inside should be treated as HTML unless the type attribute is text/javascript or is omitted.

Closing script tag not using font ligatures like other closing tags

When you have a script block or src, the closing </script> fonts with ligatures such as Fira Code do not apply the ligature to the </ as it does with all other tags.

all other tags

script tag

Project View <img> dragging into files with folders starting with "-"

While working in project view, when dragging an image out of a folder, whose name starts with a minus sign, into a file where the tag is to be placed with necessary src, alt and dimensions, an error is encountered.

<img src="-/beach.jpg" Error 1: unknown function "-/beach.jpg"
Try 'sips --help' for help using this tool
alt="Beach" />

Insert Flash Movie (Swf) errors

I get the following error when dragging an *.swf file to a HTML document:

Insert Flash Movie (Swf):81:in `slice!': bignum too big to convert into `long' (RangeError)
  from Insert Flash Movie (Swf):81:in `getNextTag'
  from Insert Flash Movie (Swf):61:in `initialize'
  from Insert Flash Movie (Swf):99:in `new'
  from Insert Flash Movie (Swf):99

script element punctuation is missing scope

Latest grammar (80e3076)

<script>
</script>

Note that > and < are not colored.
They no longer get the scope
punctuation.definition.tag.begin.html

[HTML/JS] Syntax highlighting is wrong when </script> is commented out

From @mkszepp on March 25, 2017 22:9

VSCode Version: 1.10.2 / 1.11.0-insider
OS Version: Windows 10

The syntax highlighting fails when // ]]></script> is in the same line.

<head>
    <title>Example</title>
</head>

<body>

    <script type="text/javascript">// <![CDATA[
    
        var a = 'xy';
    
    // ]]></script>

</body>

Copied from original issue: microsoft/vscode#23221

Syntax Coloring Wrong for PHP tags in attributes

The HTML bundle incorrectly highlights the syntax whenever I use inline PHP code inside a tag as an attribute, and I don't quote it. (quotes are optional in HTML5)

Example

<!DOCTYPE HTML>
<html>
<head>
    <meta charset=utf-8>
</head>
<body>
    <?$p=0?>
    <p id=paragraph<?=++$p?>>
        This is test paragraph <?=$p?>.
    </p>
    <p id="paragraph<?=$p++?>">
        This is test paragraph <?=$p?>.
    </p>
    <p id=paragraph<?=++$p?>>
        This is test paragraph <?=$p?>.
    </p>
    <p id="paragraph<?=$p++?>">
        This is test paragraph <?=$p?>.
    </p>
</body>
</html>

Syntax highlighting breaks until the next quote occurs.

`<` of closing style tag gets 'source.css' scope

<html>
<head>
	<style>
	</style>
</head>

The < of </style> tag gets 'source.css' scope. That leads to wrong colorizations when a theme colorizes 'scope.css'

HTML "script" tags improperly scoped

From @smlombardi on March 7, 2017 19:57

Steps to Reproduce:

Please see attached screenshots: the = for attributes is not the same color for script tags as all other html tags.

This is because all other tags they are scoped meta.tag.inline.any.html, whilst script tags are only text.html.basic. This is a bug IMHO.

Script tag:

Sample other tag:

Copied from original issue: microsoft/vscode#22176

HTML-bundle: refresh running browser(s) is not working

Hi,
I'm using TM Version 2.0 (9283) -registered version- on Mountain Lion.

I'm trying to use the HTML-bundle commando CMD-R (refresh running browser(s)) and I get the following error:

Failure running “Refresh Running Browser(s)”.
Command returned status code 1.

I don''t have changed any of the bundle code.

What can i do in oder to let this work?

Regards,
Feek

Double hyphens in comments being flagged as red, comments not closing

From @crops11 on April 13, 2017 13:50

VSCode Version: 1.11.1
OS Version: Windows 10 Pro

Steps to Reproduce:

Enter comment tags like so
Double hyphen in the closing tag is highlighted in red, comment tag doesn't close

Copied from original issue: microsoft/vscode#24685

Incorrect Comment Syntax for `<script>` Tag

Steps to reproduce:

Create a new document.
Change language to HTML.
Add an HTML skeleton to the page with a <script> tag inside the <body> tag:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta http-equiv="Content-type" content="text/html; charset=utf-8">
  <title>Example</title>
</head>
<body>
  <script src="main.js"></script>
</body>
</html>

Place your cursor in front of <script> tag and invoke the comment command by pressing ⌘?.

Expected result:

The line is commented with the correct HTML syntax: 

Actual result:

The line is instead commented with the incorrect syntax: // <script src="main.js"></script>.

The issue is also reproducible when:

The <script> tag is inside the <head> tag.
The <script> tag is selected.
The full line containing <script> tag is selected.

The expected result is only possible when the selection starts on the previous line and includes the full <script> tag.

Environment:

OS X version: Yosemite 10.10.5
TextMate version: 2.0-rc.1

EventHandlers content should have js coloring

From @isidorn on December 6, 2016 11:16

Refs #16526

Event handler values should have javascript coloring. Currently it is colored as a string but all the js funcitonality is there. As a user would not expect this to work due to string coloring - thus it will be hard to find the nice intelli-sense support you have there

Copied from original issue: microsoft/vscode#16628

{literal} behaves weird

From @anacierdem on January 5, 2018 11:24

VSCode Version: Version 1.19.1 (1.19.1)
OS Version: MacOS Sierra 10.12.6

Steps to Reproduce:

{literal}
  <style></style>
{/literal}

inside an HTML document.

Html is not interpreted and not highlighted.

Does this issue occur when all extensions are disabled?: No

{literal} is used in Smarty's tpl files. I also have "files.associations": {"*.tpl": "html"} in my configuration but the issue is the same for .html files.

Expected outcome:

Html should be highlighted and {literal} should be interpreted as text.

Copied from original issue: microsoft/vscode#41183

Syntax highlighting broken when PHP code is mixed inside Javascript

Dear all,

Since the later update of the bundle, syntax highlighting is broken when php code is mixed inside js.
Try :
<script type="text/javascript"> <?php echo $ok; ?> </script>

And you will see what's happening.
Is there a way to fix this ?

Thanks in advance

<script> without type=text/javascript is no longer highlighted as JavaScript

Recently the HTML bundle stopped syntax highlighting JavaScript inside of a plain <script> tag.

Test case:

<!-- Not highlighted -->
<script>var x = 1</script>

<!-- Correctly highlighted -->
<script type="text/javascript">var x = 1</script>

I would expect <script>, <script type="module">, and <script type="text/javascript"> to all behave the same way. These are each valid forms of specifying JavaScript content. See HTML Script Element - Type Attribute.

Notes: I suspect 56362f1 may be related, since it landed just a few days ago.

Syntax highlighting broken when <script> tag has no 'type="text/javascript"' attrib

Title says it.

Custom HTML tag confused by P

From @smlombardi on March 5, 2018 19:58

When using an Angular component they often use a custom HTML tag.

Prime NG, for example, uses <p-table> for their table component.

However, probably because of the opening p, the entire tag is not scoped as a tag: the -table part is mistakenly scoped as meta.tag.block.any.html entity.other.attribute-name.html

<p-table [value]="people">
  <ng-template pTemplate="header">
    <tr>
      <th>First Name</th>
      <th>Last Name</th>
      <th>Sales</th>

    </tr>
  </ng-template>
  <ng-template pTemplate="body"
               let-person>
    <tr>
      <td>{{person.firstName}}</td>
      <td>{{person.lastName}}</td>
      <td>{{person.gross_sales}}</td>

    </tr>
  </ng-template>
</p-table>

Copied from original issue: microsoft/vscode#45082

ignore

"notification.background" still used in many built-in themes

Script end tag bracket has source.js scope

From microsoft/vscode#25790 (comment):

The source.js scope on < causes colorizing issues:

Extra space when using completion

When using the "CodeCompletion HTML Tags" command there is an extra space inserted. Example case:

<t‸> → <t able align=">

Cannot decompile "Refresh Running Browser(s)" script to edit it

When running osadecompile Refresh\ Running\ Browsers.scptd/ I get the following error:

osadecompile: Refresh Running Browsers.scptd/: e.g.,: specifier asked for the 3rd, but there are only 2. Basically, this indicates a run-time resolution error.

I believe this error is because to decompile the script the command is looking for the source in another folder that is not part of the repo. Is possible to add the original source file in addition to the compiled binary?

textmate / html.tmbundle Goto Github PK

html.tmbundle's Introduction

Installation

General

License

html.tmbundle's People

Contributors

Stargazers

Watchers

Forkers

html.tmbundle's Issues

Steps to reproduce

Expected Result

Actual Result

Exptected

Actual

all other tags

script tag

Recommend Projects

Recommend Topics

Recommend Org