ALT-F1 / bootstrap3-pug-former_jade-node-express-grunt

Bootstrap 3 templated by Jade

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Invalid html created from jade files

simonjmartin opened this issue · comments

When compiling the *.jade files for bootstrap the result is invalid - the html tag is opened then closed immediately.

Steps to repeat:

  1. https://bootstrap3-jade-node-express-grunt.azurewebsites.net/template/starter-template
  2. view source
  3. result... < html lang="en"></ html>< head>...(more content; spaces added to prevent tags being interpretted)

Note that the html tag is opened then closed before the head tag is opened

Dear @simonjmartin I understand that a compilation is made ?!? could you please explain how did you compile the file ?

PS: as you may see, the source code doesn't mention the bug you are mentioning; the tag ends after the tag

Let me know

screen shot 2014-07-12 at 00 57 02

I cloned a local copy, dropped the starter-template.jade file into a local dev folder, ran "harp compile mysite" from the directory and checked the result.

But for the version I referenced in the original issue I simply navigated to the url in step 1 then checked the source:
view-source:https://bootstrap3-jade-node-express-grunt.azurewebsites.net/template/starter-template

Playing with my local version I'm working out the indentation issues in the jade file which is the cause of the issue

@simonjmartin I have no experience with http://harpjs.com/

Don't you think that there is a bug with the compiler?

Have you tried a simple jade file like this one http://naltatis.github.io/jade-syntax-docs/ ?

or test the sample under the 'Syntax' chapter on https://github.com/visionmedia/jade/

Jade compiles fine for me locally, the issue is the bootstrap jade files, the indentation is incorrect.

This can be seen by viewing the links in my previous posts. The html produced online is invalid, the html element is closed too soon.

capture

From this you can see that the url is the hosted example and it is not a case that it is a local compile that's causing the invalid html

@simonjmartin the jade file as well as the html are correct on the demo site.

screen shot 2014-07-13 at 12 17 58

Please try this piece of code on your local server and send us the result:
The code comes from the creator of Jade : https://github.com/visionmedia/jade/

doctype html
html(lang="en")
  head
    title= pageTitle
    script(type='text/javascript').
      if (foo) bar(1 + 5)
  body
    h1 Jade - node template engine
    #container.col
      if youAreUsingJade
        p You are amazing
      else
        p Get on it!
      p.
        Jade is a terse and simple templating language with a
        strong focus on performance and powerful features.

@simonjmartin you need to raise your issue with http://harpjs.com/ development team.

Do you get something different when you view the source for your demo page?
The Chrome Developer tools are formatting the compiled markup you see in your screenshot, there is no pretty indentation in the result sent to the browser. And in the version in my screenshot you can see that.

However I have solved my problem; I leave it up to you how to handle this issue.

Ok @simonjmartin but here is the result of a "Save as.." using a simple text editor:

tell us how did you correct the issue from your side for me to verify it on my staging environment.

thanks in advance

screen shot 2014-07-13 at 13 29 16

@simonjmartin now I see the issue; some tabs are missing in the source code. e.g. the grid layout is correctly indented and not the others.

feel free to "pull request" the code and amend the templates.
I'll do the changes during the summer

screen shot 2014-07-13 at 13 39 13