`dynamicPermalink: false` not working with WebC

[Kalabasa]

With this eleventy config:

eleventyConfig.addGlobalData("eleventyComputed", {
  permalink: computePermalink,
  dynamicPermalink: () => false,
});

Permalink override does not work for .webc files (but works for other files, like .md).

[rijkvanzanten]

Feels like it might be related to https://github.com/11ty/eleventy-plugin-webc/commit/e6b388a5ab375f92a2fcdb71049c67cd9541dc21

[solution-loisir]

Similarly, dynamic permalink in JavaScript data file breaks with WebC at a page level. for example: file structure

pages/
  |
  -- home.webc
  | 
  -- about.webc
  |
  -- pages.11tydata.js

pages.11tydata.js

module.exports = {
  layout: "base.webc",
  permalink: (data) => `/${data.page.fileSlug}/`
};

This provokes the following error:

link.slice is not a function (via TypeError)

11ty] Original error stack trace: TypeError: link.slice is not a function
[11ty]     at TemplatePermalink._addDefaultLinkFilename (/home/mathieu/webc-starter-kit/node_modules/@11ty/eleventy/src/TemplatePermalink.js:86:25)
[11ty]     at TemplatePermalink.toOutputPath (/home/mathieu/webc-starter-kit/node_modules/@11ty/eleventy/src/TemplatePermalink.js:95:26)
[11ty]     at TemplatePermalink.toPath (/home/mathieu/webc-starter-kit/node_modules/@11ty/eleventy/src/TemplatePermalink.js:188:20)
[11ty]     at Template.getOutputLocations (/home/mathieu/webc-starter-kit/node_modules/@11ty/eleventy/src/Template.js:308:19)
[11ty]     at async Template.addComputedData (/home/mathieu/webc-starter-kit/node_modules/@11ty/eleventy/src/Template.js:614:28)
[11ty]     at async Template.getTemplates (/home/mathieu/webc-starter-kit/node_modules/@11ty/eleventy/src/Template.js:682:7)
[11ty]     at async TemplateMap.initDependencyMap (/home/mathieu/webc-starter-kit/node_modules/@11ty/eleventy/src/TemplateMap.js:410:22)
[11ty]     at async TemplateMap.cache (/home/mathieu/webc-starter-kit/node_modules/@11ty/eleventy/src/TemplateMap.js:454:5)
[11ty]     at async TemplateWriter._createTemplateMap (/home/mathieu/webc-starter-kit/node_modules/@11ty/eleventy/src/TemplateWriter.js:330:5)
[11ty]     at async TemplateWriter.generateTemplates (/home/mathieu/webc-starter-kit/node_modules/@11ty/eleventy/src/TemplateWriter.js:360:5)
[11ty] Wrote 0 files in 0.04 seconds (v2.0.0-beta.2)

Removing the permalink property from pages.11tydata.js removes the error. The same pattern works with Markdown files. Permalinks seems to be problematic with WebC file. Or else there's a trick for using dynamic permalinks with WebC pages that I ignore.

[zachleat]

I think there is something here but I do want to point out up front that setting dynamicPermalink via computed data is not currently supported per the big info box on top of https://www.11ty.dev/docs/data-computed/

Try this instead:

eleventyConfig.addGlobalData("dynamicPermalink", false);

[zachleat]

Uncovered this one https://github.com/11ty/eleventy/issues/2823

[zachleat]

I think the other confusing bit here is how addGlobalData works with permalink. The argument passed in there is basically the same as a module.exports from a JS data file.

So:

// this will not work because `data` is not meaningful and it assigns permalink to a string
eleventyConfig.addGlobalData("permalink", (data) => {
  return `${data.page.filePathStem}.html`;
});

// this will work, because it assigns permalink as a computed data JavaScript function (not a template string)
eleventyConfig.addGlobalData("permalink", () => {
  return (data) => `${data.page.filePathStem}.html`;
});

https://www.11ty.dev/docs/data-global-custom/ https://www.11ty.dev/docs/data-computed/#using-javascript https://www.11ty.dev/docs/data-computed/#using-a-template-string

[zachleat]

So a few things going on here, I’ll leave this open as a tracking issue until https://github.com/11ty/eleventy/issues/2823 is fixed.

[zachleat]

Note the change in raw permalink strings in WebC in WebC 0.9.0: https://github.com/11ty/eleventy-plugin-webc/issues/52#issuecomment-1440980148

[monochromer]

I think, this also applies to this issue. If you set permalink: false as a global variable, then Eleventy ignore it and tries to render webc files with error:

Problem writing Eleventy templates: (more in DEBUG output)
1. Having trouble rendering webc template ./src/pages/about/about.webc (via TemplateContentRenderError)
2. Cannot read properties of undefined (reading 'url') (via TypeError)

Original error stack trace: TypeError: Cannot read properties of undefined (reading 'url')
  at Object.addContent (<PROJECT_FOLDER>/node_modules/@11ty/eleventy-plugin-bundle/eleventy.shortcodes.js:24:39)
  at Object.css (<PROJECT_FOLDER>/node_modules/@11ty/eleventy/src/BenchmarkGroup.js:32:26)
  at Object.<anonymous> (<PROJECT_FOLDER>/node_modules/@11ty/eleventy-plugin-webc/src/eleventyWebcTemplate.js:141:37)
  at async Template._render (<PROJECT_FOLDER>/node_modules/@11ty/eleventy/src/TemplateContent.js:514:22)
  at async Template.renderWithoutLayout (<PROJECT_FOLDER>/node_modules/@11ty/eleventy/src/Template.js:456:27)
  at async TemplateMap.populateContentDataInMap (<PROJECT_FOLDER>/node_modules/@11ty/eleventy/src/TemplateMap.js:589:39)
  at async TemplateMap.cache (<PROJECT_FOLDER>/node_modules/@11ty/eleventy/src/TemplateMap.js:483:5)
  at async TemplateWriter._createTemplateMap (<PROJECT_FOLDER>/node_modules/@11ty/eleventy/src/TemplateWriter.js:330:5)
  at async TemplateWriter.generateTemplates (<PROJECT_FOLDER>/node_modules/@11ty/eleventy/src/TemplateWriter.js:360:5)
  at async TemplateWriter.write (<PROJECT_FOLDER>/node_modules/@11ty/eleventy/src/TemplateWriter.js:407:23)