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.

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

Javascript Return Values Containing Shortcode Not Rendering #2069

Open
stevenmilstein opened this issue Nov 4, 2021 · 1 comment
Open

Javascript Return Values Containing Shortcode Not Rendering #2069

stevenmilstein opened this issue Nov 4, 2021 · 1 comment

Comments

@stevenmilstein
Copy link

Describe the bug
I'd like to use Javascript Functions to return a shortcode so that it may be rendered in a layout.

I can use Eleventy Computed to return a hardcoded template string data variable that renders as expected:
{% now %} renders Thu Nov 04 2021 17:46:05 GMT-0400 (GMT-04:00).

However, an Eleventy Computed Function that returns the equivalent, does not render the shortcode.
{% now %} renders {% now %}.

Despite my best efforts following the examples provided on https://www.11ty.dev/docs/data-computed/#using-javascript, I could still be missing something very basic. But I don't think this is related to markdown-It.render().

To Reproduce
You can clone the repo https://github.com/stevenmilstein/11ty-js-functions-and-shortcodes, try it on Stackblitz, or,

1. Update /.eleventy.js accordingly

module.exports = (eleventyConfig) => {

  eleventyConfig.addShortcode("now", () => {
    return new Date();
  });

  // This has no affect
  eleventyConfig.setDataDeepMerge(true);

  return {
    dir: {
      input: "./src",
      includes: "_includes",
      data: "_data",
      output: "./_site",
    },
  };
};

2. Create ./src/_includes/base.njk

<!doctype html>
<html lang="en">
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="description" content="Javascript Return Values Containing Shortcode Not Rendering">
		<title> {{ title }} </title>
	</head>
	<body>
		<main>
            <h1> {{ title }} </h1>
            <h2> {{ summary }} </h2>
			<div>{{ content | safe }}</div>

		</main>
	</body>
</html>

3. Create /src/index.njk

---js
{
  title: "Simple",
  summary: "Javascript Return Values Containing Shortcode Not Rendering",
  layout: "base.njk",
  permalink: "/",
  eleventyComputed: {
    computedString: "{% now %}",
    computedFunc: (data) => "{% now %}",
  }
}
---

shortcode: {% now %}

computedString: {{ computedString }}

computedFunc: {{ computedFunc }} 

Expected behavior
Javascript Function return values containing shortcodes should get processed.

Screenshots
11ty-js-functions-and-shortcodes

Environment:

  • Mac OS Version 10.13.6 (17G14042)
  • Eleventy Version 0.12.1

Additional context
This issue is related to #2019, #2025 and #2057.
I came across this problem while trying to use https://www.11ty.dev/docs/plugins/serverless/ (version 1.0.0-canary.44) to develop a live custom preview for Netlify CMS. I went back to Version 0.12.1 hoping the root cause was a beta thing.

Possible Regression in version 1.0.0-canary.44
2021-11-04_17-49-38
A Global Data JSON globalDataJsonNow.now renders the shortcode as expected in 0.12.1 but not in 1.0.0-canary.44.

@edmeehan
Copy link

Having the same issue, and very difficult to find a solution. Given this was opened almost 18 months ago with no response is not a good feeling.

Observing the same issue. The computed template string returns the expected result, but the computed function does not

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants