11ty / eleventy-plugin-template-languages

Official template syntax plugins for Eleventy
MIT License
2 stars 2 forks source link

Pug includes used only in other _includes trigger a re-render on --watch but aren't processed. #3

Open yhorian opened 1 year ago

yhorian commented 1 year ago

Operating system

Windows 11

Eleventy

v2.0.0-canary.28

Describe the bug

If an _include file (nav.pug) that is used in another _include file (default.pug) is changed, and it's not used anywhere outside of _includes, then when Eleventy rebuilds it does not re-render the first include (nav.pug) when it updates the second (default.pug).

This means using a component layout with _includes in Pug, if the include is not directly used by something outside the directory you have to force a full render to work on the file.

What makes this bug insidious is that the first time you save the file with --incremental --ignore-initial it DOES render.

Reproduction steps

  1. Add a new file: _include/test.pug
  2. Add text: h2 Include Test
  3. Add this to the top of a current layout, such as _include/default.pug using include ./_include/test.pug
  4. Create an index.pug file that uses _include/default.pug as it's layout.
  5. Run Eleventy in dev mode. "npx eleventy --watch --serve"
  6. Change _include/default.pug by adding -> p Layout Test. It will trigger watch as expected, adding in the new element.
  7. Change _include/test.pug by adding -> p Include Test. This will trigger watch and add an element as expected.
  8. Change _include/default.pug again -> p Layout Test2. It will trigger watch as expected, adding in the new element.
  9. Change _include/test.pug again by adding -> p This is the second save.. This will trigger watch but nothing will appear.
  10. Change _include/default.pug a third time -> p Layout Test3. This will trigger watch and add the "Layout Test3" text but the "second save" text from test.pug will still not appear.
  11. Restart development mode or run a build. Now the changes are there, "This is the second save." appears as expected.
  12. Repeat again, the first time the include is changed it appears. The 2nd save does nothing.

Expected behavior

It's expected that when you trigger a re-render with --watch that the code is included!

Reproduction URL

No response

Screenshots

No response

zachleat commented 1 year ago

--incremental or no?

yhorian commented 1 year ago

Tried with both, and neither wanted to save more than once. I also ran the tests with nunjucks - worked as expected.

I ran another test using Pugs extends/blocks instead of the eleventy system. That all works 100%. Renders any length of child templates with extends/blocks no problems.

It's just Pug and nested includes. It won't save more than once with --incremental, or without. Here's my test setup for the bug:

/test-page.pug - page

---
title: Testing pug inheritance
permalink: "| /test-pug/"
layout: test_layout.pug
---

h1 #{ title }

/_includes/test-layout.pug - parent include

p 1st:
    | !{ content }
p 2nd:
    include partials/test_include.pug

/_includes/test-include.pug - child include

p Test include here

If you edit and save the child include then it won't update even though it triggers a file change on watch.

If you then go to edit and save page it still won't update.

If you edit and save the parent include it will finally update the template with the current child include.

Seems that any _include/ file that uses another _include/ file won't fetch a fresh render of it in Pug using --watch unless it's refreshed itself. You can see this behaviour by adding an include for the child include to the page as well. The page will always have the freshest version while continuing to display the old version until the parent include is refreshed.

Zearin commented 1 year ago

(Psst! This Issue should be tagged with template-language:pug)

harrislapiroff commented 1 year ago

I'm not using any includes but I think I'm experience either the same or a similar issue using pug's extends and block. My templates look like this:

_includes/
├ base.pug
└ monotheme/
  ├ home.pug
  └ monotheme.pug

where monotheme/home.pug extends from monotheme/monotheme.pug extends from base.pug. Updating monotheme/monotheme.pug doesn't change how my pages render. I have to restart the eleventy process to see changes.

macOS 13.3.1 (a) Eleventy 2.0.1

yonlevtlk commented 1 year ago

It seems to me it should be tagged as a bug.

atolk commented 1 year ago

I'm not sure about elegance but it works.

In the Engines/pug.js async compile(...) function instead of returning a pug compile function return a function that will compile the template anew each time.

//return this.pugLib.compile(str, options);
const renderFunc = (locals) => {
  const compiledFunc = this.pugLib.compile(str, options)
  return compiledFunc(locals)
}
return renderFunc
starikcetin commented 1 year ago

Are there any news on this issue? I am also experiencing it. The watch detects the change, but the output file doesn't update. It definitely looks like a bug. Windows 10 Eleventy 2.0.1

Edit: I can confirm the suggestion of @atolk works as expected. Here is the patch file for patch-package: @11ty+eleventy+2.0.1.patch

Zearin commented 1 year ago

@zachleat There's a patch suggestion above. Can you review?