Add globalData via config

[MadeByMike]

Adds a new method to support adding of global data through config such as:

eleventyConfig.addGlobalData('function', () => new Date());

eleventyConfig.addGlobalData('async',  () =>
      new Promise((resolve) => {
        setTimeout(resolve, 100, "foo");
      })
);

eleventyConfig.addGlobalData('static', 'static');

Or chaining:

eleventyConfig
  .addGlobalData('function', () => new Date())
  .addGlobalData('async',  () =>
      new Promise((resolve) => {
        setTimeout(resolve, 100, "foo");
      })
  )
  .addGlobalData('static', 'static');

Date is a rather simple but useless example. Where this becomes more useful for me is sourcing initial global data from files stored above the inputDir. This solves #655 as you can import functions or an object from any file.

Where this becomes most interesting for me, is giving plugins the ability to provide data in addition to config. This opens up a whole range of possibilities one example might be an ecommerce plugin that sources data from an external API.

[MadeByMike]

I've been using this in the wild for a few days now and I've learnt that what I often want to do is set multiple keys like this:

eleventyConfig.addGlobalData({
  buildTime: () => new Date(),
  somethingElse: 42
});

Any thoughts before I change it?

[MadeByMike]

Ok I added the new format

[zachleat]

I do like this but I’m worried there is some ambiguity with the methods and how they relate to global data.

Specifically I’d like this to mimic a global data file.

eleventyConfig.addGlobalData({
    function: () => new Date(),
    async: async () =>
      new Promise((resolve) => {
        setTimeout(resolve, 100, "foo");
      }),
    static: "static",
});

This creates special new behavior for top level keys that are functions or promises in the object. Whereas this style:

eleventyConfig.addGlobalData("function", () => new Date());
eleventyConfig.addGlobalData("async", async () => new Date());
eleventyConfig.addGlobalData("static", "static");

Better matches how global data files work now. Does that make sense?

Here’s what might be confusing to me, consider the following global data file _data/myGlobal.js (that is similar to the first addGlobalData example above)

module.exports = {
    function: () => new Date(),
    async: async () =>
      new Promise((resolve) => {
        setTimeout(resolve, 100, "foo");
      }),
    static: "static",
};

With current Eleventy behavior the global data file would return the object without any function calls or promise resolving, right?

[MadeByMike]

Thanks @zachleat - reverted back to that signature format as suggested. My only concern here is I often have a plugin that does a bunch of stuff and then wants to add a big object to global data. Now I need to do this:

for (const [key, value] of Object.entries(stuffToAdd)) {
  eleventyConfig.addGlobalData(key, value);
}

A small bit of boilerplate that most plugins adding data will probably need. No big deal.

[zachleat]

Ah, sorry a few more thoughts: Not saying it does—just trying to think through it—but I wonder if this might need to work with deep merging? I think previously global data was just a shallow copy which has been fine because it’s first in the chain but we might get into some tricky situations. (After typing this all out—I think it’s probably fine to punt on this one for now but I just wanted to log it)

Related: As it stands, it looks like a global data file would overwrite the same key entry set in addGlobalData. Is this what we want or the other way around? I think addGlobalData will probably be plugin-land so I think global data files should probably have precedence. Okay, I’m done now—looks good!

[zachleat]

Shipping!

[zachleat]

Docs issue here #1386