Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Incorrect comment format for HTML #59854

Closed
SFoskitt opened this issue Oct 2, 2018 · 7 comments
Closed

Incorrect comment format for HTML #59854

SFoskitt opened this issue Oct 2, 2018 · 7 comments
Assignees
@aeschli
Labels
bug Issue identified by VS Code Team member as probable bug *duplicate Issue identified as a duplicate of another issue(s) html HTML support issues

Comments

@SFoskitt
Copy link

SFoskitt commented Oct 2, 2018

Issue Type: Bug

VSCode recognizes this file as HTML but comments appear as Javascript like // instead of using keyboard combo Cmd + / (on Mac). Keyboard mappings in VSCode are verified as "Toggle Line Comment". THE WEIRD PART - it only does this on ONE file. One *.html file.

VS Code version: Code 1.27.2 (f46c4c4, 2018-09-12T07:04:11.329Z)
OS version: Darwin x64 16.7.0

System Info
Item Value
CPUs Intel(R) Core(TM) i7-4870HQ CPU @ 2.50GHz (8 x 2500)
GPU Status 2d_canvas: enabled
checker_imaging: disabled_off
flash_3d: enabled
flash_stage3d: enabled
flash_stage3d_baseline: enabled
gpu_compositing: enabled
multiple_raster_threads: enabled_on
native_gpu_memory_buffers: enabled
rasterization: enabled
video_decode: enabled
video_encode: enabled
webgl: enabled
webgl2: enabled
Load (avg) 5, 4, 3
Memory (System) 16.00GB (0.47GB free)
Process Argv /Applications/Visual Studio Code.app/Contents/MacOS/Electron
Screen Reader no
VM 0%
Extensions: none
@vscodebot
Copy link

vscodebot bot commented Oct 2, 2018

(Experimental duplicate detection)
Thanks for submitting this issue. Please also check if it is already covered by an existing one, like:

@RMacfarlane
Copy link
Contributor

Could you share the text of the HTML file this happens for?

@RMacfarlane RMacfarlane added html HTML support issues info-needed Issue requires more information from poster labels Oct 2, 2018
@SFoskitt
Copy link
Author

SFoskitt commented Oct 3, 2018 •
edited by mjbvz
Loading

Hi, @RMacfarlane -
Github will not allow upload/attach of file type HTML so I have copied/pasted the content here. I get Javascript comments no matter which line(s) are selected (even the <br/> lines).

  • Stephanie
<!DOCTYPE html>
<html>
  <head>
    <script>var year = new Date().getFullYear()</script>
  </head>
  <body>
    <h5 class="copy"> &copy; <script>document.write(new Date().getFullYear());</script> </h5>

    <script>document.write(new Date().getFullYear());</script>

    <!-- type = ?? default -->
    <div id="widget-wrap-main" style="width: 100%">
      <script>
        (function(document, window){
          var ws = document.createElement('script');
          ws.id = 'bri-widget';
          ws.type = 'text/javascript';
          ws.src = '//localhost:7474/review/814.js';
          ws.async = !0;
          document.body.appendChild(ws);
        }(document, window));
      </script>
    </div>

    <!-- type = 7 -->
    <div id="widget-wrap-main-carousel-rating" style="width: 75%"> 
      <script>
        (function(document, window){
          var ws = document.createElement('script');
          ws.id = 'bri-widget';
          ws.type = 'text/javascript'; 
          ws.src = '//localhost:7474/review/814.js';
          ws.async = !0;
          document.body.appendChild(ws);
        }(document, window));
      </script>
    </div>
  
    <!-- type = 1 default -->
    <div id="default-widget-wrap-main-both" style="width: 75%">
      <script>
        (function(document, window){
          var ws = document.createElement('script');
          ws.id = 'bri-widget';
          ws.type = 'text/javascript';
          ws.src = '//localhost:7474/review/814.js';
          ws.async = !0;
          document.body.appendChild(ws);
        }(document, window));
      </script>
    </div>
    <div>
      <a href="\sipStagingP2.html">Page 2</a>
      <br/>
      <a href="\sipStagingP3.html">Page 3</a>
      <br/>
      <a href="\sipStagingP4.html">Page 4</a>
      <br/>
      You are looking at a page with STAGING SIP SIP SIP!!!!<BR>

      TESTING NOTES:<BR>
      <BR>
      NOT WORKING AS EXPECTED ???<BR>
      REMEMBER, LOAD THIS PAGE AS MOBILE!!!!<BR>


         Site abandonment

        <A NAME="top">

        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
      1<br/>
      2<br/>
      3<br/>
      4<br/>
      5<br/>
      6<br/>
      7<br/>
      8<br/>
      9<br/>
      10<br/>

      test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
      11<br/>
      12<br/>
      13<br/>
      14<br/>
      15<br/>
      16<br/>
      17<br/>
      18<br/>
      19<br/>
      20<br/>
      test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
      21<br/>
      22<br/>
      23<br/>
      24<br/>
      25<br/>
      26<br/>
      27<br/>
      28<br/>
      29<br/>
      30<br/>
      test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
      31<br/>
      32<br/>
      33<br/>
      34<br/>
      35<br/>
      36<br/>
      37<br/>
      38<br/>
      39<br/>
      40<br/>
      test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
      41<br/>
      42<br/>
      43<br/>
      44<br/>
      45<br/>
      46<br/>
      47<br/>
      48<br/>
      49<br/>
      50<br/>
      test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>

        MIDDLE - MIDDLE - MIDDLE <br/>
          MIDDLE - MIDDLE - MIDDLE <br/>
          MIDDLE - MIDDLE - MIDDLE <br/>
          MIDDLE - MIDDLE - MIDDLE <br/>

      <A HREF="#top">Back To Top</A> <br/>

        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
      1<br/>
      2<br/>
      3<br/>
      4<br/>
      5<br/>
      6<br/>
      7<br/>
      8<br/>
      9<br/>
      10<br/>
      test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
      11<br/>
      12<br/>
      13<br/>
      14<br/>
      15<br/>
      16<br/>
      17<br/>
      18<br/>
      19<br/>
      20<br/>
      test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
      21<br/>
      22<br/>
      23<br/>
      24<br/>
      25<br/>
      26<br/>
      27<br/>
      28<br/>
      29<br/>
      30<br/>
      test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
      31<br/>
      32<br/>
      33<br/>
      34<br/>
      35<br/>
      36<br/>
      37<br/>
      38<br/>
      39<br/>
      40<br/>
      test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
      41<br/>
      42<br/>
      43<br/>
      44<br/>
      45<br/>
      46<br/>
      47<br/>
      48<br/>
      49<br/>
      50<br/>

        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>
        test!! TEST ! TEST! <br/>


          END - END - END - END <br/>
          END - END - END - END <br/>
          END - END - END - END <br/>
          END - END - END - END <br/>
          END - END - END - END <br/>
          END - END - END - END <br/>


      <A HREF="#top">Back To Top</A> <br/>

      <form action="#" method="post">
    <div>
         <label for="name">Text Input:</label>
         <input type="text" name="name" id="name" value="" tabindex="1" />
    </div>

    <div>
         <h4>Radio Button Choice</h4>

         <label for="radio-choice-1">Choice 1</label>
         <input type="radio" name="radio-choice-1" id="radio-choice-1" tabindex="2" value="choice-1" />

     <label for="radio-choice-2">Choice 2</label>
         <input type="radio" name="radio-choice-2" id="radio-choice-2" tabindex="3" value="choice-2" />
    </div>

  <div>
    <label for="select-choice">Select Dropdown Choice:</label>
    <select name="select-choice" id="select-choice">
      <option value="Choice 1">Choice 1</option>
      <option value="Choice 2">Choice 2</option>
      <option value="Choice 3">Choice 3</option>
    </select>
  </div>

  <div>
    <label for="textarea">Textarea:</label>
    <textarea cols="40" rows="8" name="textarea" id="textarea"></textarea>
  </div>

  <div>
      <label for="checkbox">Checkbox:</label>
    <input type="checkbox" name="checkbox" id="checkbox" />
    </div>

  <div>
      <input type="submit" value="Submit" />
    </div>
</form>
</body>
</html>

@RMacfarlane
Copy link
Contributor

Thanks @SFoskitt! I'm able to reproduce the problem using VSCode 1.27.2.

It looks like this has already been fixed in the Insider's version of VSCode, 1.28.0. You can download it here: https://code.visualstudio.com/insiders/, or wait for the release later this week.

@RMacfarlane RMacfarlane added bug Issue identified by VS Code Team member as probable bug and removed info-needed Issue requires more information from poster labels Oct 3, 2018
@RMacfarlane RMacfarlane added this to the September 2018 milestone Oct 3, 2018
@mjbvz
Copy link
Collaborator

mjbvz commented Oct 3, 2018

Hey I'm still seeing this in 431ef9d

Moving out to October. @aeschli can you please take a look

@mjbvz mjbvz reopened this Oct 3, 2018
@mjbvz mjbvz modified the milestones: September 2018, October 2018 Oct 3, 2018
@aeschli aeschli removed this from the October 2018 milestone Oct 4, 2018
@aeschli aeschli added the *duplicate Issue identified as a duplicate of another issue(s) label Oct 4, 2018
@aeschli
Copy link
Contributor

aeschli commented Oct 4, 2018

It's a grammar / textmate issue.
<script>var year = new Date().getFullYear()</script>

The grammar thinks < is an operator for the expression and continues to parse the rest of the file as JavaScript.

The problem is that JavaScript grammar is not aware that it is used embedded. The best way would be if HTML includes its own grammar for embedded JavaScript: textmate/html.tmbundle#85

Embedded languages are a known weakness of TextMate. We have #20488 as dept item for this.

@SFoskitt I don't see a fix coming for this in the near future. As a workaround you can get things working again by adding a semicolon to the line mentioned:
<script>var year = new Date().getFullYear();</script>

Clsoing this issue as a duplicate of the issues mentioned above.

@aeschli aeschli closed this as completed Oct 4, 2018
@vscodebot
Copy link

vscodebot bot commented Oct 4, 2018

Thanks for creating this issue! We figured it's covering the same as another one we already have. Thus, we closed this one as a duplicate. You can search for existing issues here. See also our issue reporting guidelines.

Happy Coding!

@vscodebot vscodebot bot locked and limited conversation to collaborators Nov 18, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@aeschli aeschli

Labels
bug Issue identified by VS Code Team member as probable bug *duplicate Issue identified as a duplicate of another issue(s) html HTML support issues
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@RMacfarlane @aeschli @SFoskitt @mjbvz