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

Too much indentation breaks things? #109

Open
NullVoxPopuli opened this issue Sep 18, 2021 · 6 comments
Open

Too much indentation breaks things? #109

NullVoxPopuli opened this issue Sep 18, 2021 · 6 comments

Comments

@NullVoxPopuli
Copy link
Contributor

NullVoxPopuli commented Sep 18, 2021 •
edited
Loading

I'm working on making an Ember cheatsheet for folks learning ember, and I've written this "markdown" so far:

# {{t 'layout.application.title'}}


<p>{{t 'layout.application.description-1' htmlSafe=true}}</p>
<p>{{t 'layout.application.description-2' htmlSafe=true}}</p>


<GuideSection @id='generating-files' as |Section|>
  <Section @id='generating-component'>
    <:example>

      ```bash
      # -gc stands for glimmer component
      ember generate component my-component -gc

      # See the full set of options with:
      ember generate component --help
      ```

    <:/example>
  </Section>

  <Section @id='file-structure'>
  </Section>
</GuideSection>

But, I get the error:

Template Compiler Error (TemplateCompiler) in ember-octane-vs-classic-cheat-sheet/templates/docs.hbs

Closing tag </Section> did not match last open tag <:example> (on line 6): 

|
|  </Section>
|

(error occurred in 'ember-octane-vs-classic-cheat-sheet/templates/docs.hbs' @ line 17 : column 2)

and running with DEBUG=@docfy/*, I get the following log:

log file 

=================================================================================

ENV Summary:

  TIME: Sat Sep 18 2021 11:15:21 GMT-0400 (Eastern Daylight Time)
  TITLE: ember
  ARGV:
  - 🏠/.volta/tools/image/node/14.17.6/bin/node
  - /✂️/ember-cheat-sheet/node_modules/.bin/ember
  - serve
  EXEC_PATH: 🏠/.volta/tools/image/node/14.17.6/bin/node
  TMPDIR: /tmp
  SHELL: /bin/bash
  PATH:
  - /tmp/yarn--1631978109995-0.8884726619933956
  - /✂️/ember-cheat-sheet/node_modules/.bin
  - 🏠/.config/yarn/link/node_modules/.bin
  - 🏠/.yarn/bin
  - 🏠/.volta/tools/image/node/14.17.6/libexec/lib/node_modules/npm/bin/node-gyp-bin
  - 🏠/.volta/tools/image/node/14.17.6/lib/node_modules/npm/bin/node-gyp-bin
  - 🏠/.volta/tools/image/node/14.17.6/bin/node_modules/npm/bin/node-gyp-bin
  - 🏠/.volta/tools/image/yarn/1.22.11/bin
  - 🏠/.volta/tools/image/node/14.17.6/bin
  - 🏠/.volta/bin
  - 🏠/.pythons/Python-3.6.3/bin
  - 🏠/.cargo/bin
  - 🏠/Applications
  - 🏠/apps/phantomjs/bin
  - 🏠/scripts/system-utils
  - 🏠/scripts/git
  - 🏠/scripts/rails
  - 🏠/scripts
  - 🏠/.volta/bin
  - 🏠/.pythons/Python-3.6.3/bin
  - 🏠/.cargo/bin
  - 🏠/Applications
  - 🏠/apps/phantomjs/bin
  - 🏠/scripts/system-utils
  - 🏠/scripts/git
  - 🏠/scripts/rails
  - 🏠/scripts
  - /usr/local/sbin
  - /usr/local/bin
  - /usr/sbin
  - /usr/bin
  - /sbin
  - /bin
  - /usr/games
  - /usr/local/games
  - /snap/bin
  - /snap/bin
  - 🏠/.fzf/bin
  PLATFORM: linux x64
  FREEMEM: 19545841664
  TOTALMEM: 33442414592
  UPTIME: 5440.65
  LOADAVG: 1.18,0.71,0.58
  CPUS:
  - 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz - 2938
  - 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz - 2231
  - 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz - 2400
  - 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz - 2400
  - 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz - 2938
  - 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz - 2400
  - 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz - 2400
  - 11th Gen Intel(R) Core(TM) i5-1135G7 @ 2.40GHz - 2400
  ENDIANNESS: LE
  VERSIONS:
  - ares: 1.17.2
  - brotli: 1.0.9
  - cldr: 39.0
  - icu: 69.1
  - llhttp: 2.1.3
  - modules: 83
  - napi: 8
  - nghttp2: 1.42.0
  - node: 14.17.6
  - openssl: 1.1.1l
  - tz: 2021a
  - unicode: 13.0
  - uv: 1.41.0
  - v8: 8.4.371.23-node.76
  - zlib: 1.2.11

ERROR Summary:

  - broccoliBuilderErrorStack: SyntaxError: Closing tag </Section> did not match last open tag <:example> (on line 6): 

|
|  </Section>
|

(error occurred in 'ember-octane-vs-classic-cheat-sheet/templates/docs.hbs' @ line 17 : column 2)
    at generateSyntaxError (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:11493:17)
    at TokenizerEventHandlers.validateEndTag (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:13427:15)
    at TokenizerEventHandlers.finishEndTag (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:13298:12)
    at TokenizerEventHandlers.finishTag (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:13268:14)
    at EventedTokenizer.endTagName (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:23478:27)
    at EventedTokenizer.tokenizePart (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:23771:19)
    at TokenizerEventHandlers.ContentStatement (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:12863:22)
    at TokenizerEventHandlers.acceptNode (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:12550:29)
    at TokenizerEventHandlers.Program (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:12670:14)
    at TokenizerEventHandlers.acceptTemplate (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:12546:29)
  - code: [undefined]
  - codeFrame: Closing tag </Section> did not match last open tag <:example> (on line 6): 

|
|  </Section>
|

(error occurred in 'ember-octane-vs-classic-cheat-sheet/templates/docs.hbs' @ line 17 : column 2)
  - errorMessage: ember-octane-vs-classic-cheat-sheet/templates/docs.hbs: Closing tag </Section> did not match last open tag <:example> (on line 6): 

|
|  </Section>
|

(error occurred in 'ember-octane-vs-classic-cheat-sheet/templates/docs.hbs' @ line 17 : column 2)
        in /tmp/broccoli-69332AQQgj7RPWki7/out-269-colocated_template_processor
        at TemplateCompiler
  - errorType: Template Compiler Error
  - location:
    - column: [undefined]
    - file: ember-octane-vs-classic-cheat-sheet/templates/docs.hbs
    - line: [undefined]
    - treeDir: /tmp/broccoli-69332AQQgj7RPWki7/out-269-colocated_template_processor
  - message: ember-octane-vs-classic-cheat-sheet/templates/docs.hbs: Closing tag </Section> did not match last open tag <:example> (on line 6): 

|
|  </Section>
|

(error occurred in 'ember-octane-vs-classic-cheat-sheet/templates/docs.hbs' @ line 17 : column 2)
        in /tmp/broccoli-69332AQQgj7RPWki7/out-269-colocated_template_processor
        at TemplateCompiler
  - name: Error
  - nodeAnnotation: [undefined]
  - nodeName: TemplateCompiler
  - originalErrorMessage: Closing tag </Section> did not match last open tag <:example> (on line 6): 

|
|  </Section>
|

(error occurred in 'ember-octane-vs-classic-cheat-sheet/templates/docs.hbs' @ line 17 : column 2)
  - stack: SyntaxError: Closing tag </Section> did not match last open tag <:example> (on line 6): 

|
|  </Section>
|

(error occurred in 'ember-octane-vs-classic-cheat-sheet/templates/docs.hbs' @ line 17 : column 2)
    at generateSyntaxError (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:11493:17)
    at TokenizerEventHandlers.validateEndTag (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:13427:15)
    at TokenizerEventHandlers.finishEndTag (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:13298:12)
    at TokenizerEventHandlers.finishTag (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:13268:14)
    at EventedTokenizer.endTagName (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:23478:27)
    at EventedTokenizer.tokenizePart (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:23771:19)
    at TokenizerEventHandlers.ContentStatement (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:12863:22)
    at TokenizerEventHandlers.acceptNode (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:12550:29)
    at TokenizerEventHandlers.Program (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:12670:14)
    at TokenizerEventHandlers.acceptTemplate (/✂️/ember-cheat-sheet/node_modules/ember-source/dist/ember-template-compiler.js:12546:29)

=================================================================================

Which points me at this directory:

/tmp/broccoli-69332AQQgj7RPWki7/out-269-colocated_template_processor

which, reveals the following output (routes/docs.hbs):

<h1 id="t-layoutapplicationtitle"><a href="#t-layoutapplicationtitle">{{t 'layout.application.title'}}</a></h1>
<p>{{t 'layout.application.description-1' htmlSafe=true}}</p>
<p>{{t 'layout.application.description-2' htmlSafe=true}}</p>
<GuideSection @id='generating-files' as |Section|>
  <Section @id='generating-component'>
    <:example>
<pre><code>  \`\`\`bash
  # -gc stands for glimmer component
  ember generate component my-component -gc

  # See the full set of options with:
  ember generate component --help
  \`\`\`

&#x3C;:/example>
</code></pre>
  </Section>
  <Section @id='file-structure'>
  </Section>
</GuideSection>

Do we need to switch to rehype and rewrite remark-hbs for rehype?
@NullVoxPopuli
Copy link
Contributor Author

Here is a reproduction: NullVoxPopuli/ember-cheat-sheet#1

@NullVoxPopuli NullVoxPopuli mentioned this issue Sep 18, 2021
Merged
@NullVoxPopuli
Copy link
Contributor Author

NullVoxPopuli commented Sep 18, 2021 •
edited
Loading

Seems this breaks, too:

<GuideSection @id='generating-files' as |Section|>
  <Section @id='generating-component'>
  <:example>
\`\`\`bash
# -gc stands for glimmer component
ember generate component my-component -gc

# See the full set of options with:
ember generate component --help
\`\`\`
  <:/example>
  </Section>

  <Section @id='file-structure'>
  </Section>
</GuideSection>

as well as

<GuideSection @id='generating-files' as |Section|>
  <Section @id='generating-component'>
  <:example>

\`\`\`bash
# -gc stands for glimmer component
ember generate component my-component -gc

# See the full set of options with:
ember generate component --help
\`\`\`

  <:/example>
  </Section>

  <Section @id='file-structure'>
  </Section>
</GuideSection>

@NullVoxPopuli
Copy link
Contributor Author

omg, I had the : and / swapped on the closing element. 🤦

@NullVoxPopuli
Copy link
Contributor Author

still errors, tho

@NullVoxPopuli
Copy link
Contributor Author

ok, so this renders, but the indentation is not ideal:

<GuideSection @id='generating-files' as |Section|>
  <Section @id='generating-component'>
  <:example>

    \`\`\`bash
    # -gc stands for glimmer component
    ember generate component my-component -gc

    # See the full set of options with:
    ember generate component --help
    \`\`\`

  </:example>
  </Section>

  <Section @id='file-structure'>
  </Section>
</GuideSection>

but, the code block isn't converted to a highlighted codeblock

@NullVoxPopuli
Copy link
Contributor Author

NullVoxPopuli commented Sep 18, 2021 •
edited
Loading

de-denting the code-snippet gets hljs to run on it:

<GuideSection @id='generating-files' as |Section|>
  <Section @id='generating-component'>
  <:example>

\`\`\`bash
# -gc stands for glimmer component
ember generate component my-component -gc

# See the full set of options with:
ember generate component --help
\`\`\`

  </:example>
  </Section>

  <Section @id='file-structure'>
  </Section>
</GuideSection>

I guess.. there are a lot of different bugs going on here (2, I guess)

  • Too much indentation breaks the remark-hbs plugin
  • Can't have indentation of anything when you go in to markdown mode in a markdown block

Which maybe all boils down to one core issue:

  • indentation level not stripped in nested components/elements

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@NullVoxPopuli