Use runkit snippets in fake documentation

[srknzl]

Purpose (TL;DR) - mandatory

In #2360, I forgot to replace snippets with runkit samples. This pr adds runkit samples to fakes.md and makes small changes to the fakes.md required due to using runkit examples

How to verify - mandatory

1. remove _releases/latest and copy release-source/release to _releases folder with the name latest
2. cd docs
3. gem install bundler
4. bundle install
5. bundle exec jekyll serve
6. go to http://localhost:4000/releases/latest/fakes/ to see new version of fakes.md

Checklist for author

• npm run lint passes(only docs change is done, and no linting error in docs folder. there are some errors in scripts folder but they are unrelated)
• References to standard library functions are cached.

cc @fatso83

[srknzl]

this was leftover

[srknzl]

no more output comparison, so the change is needed

[srknzl]

runkit samples have the spy call part indicated with a comment

[fatso83]

Perfect! The only thing that is a bit of a shame with RunKit is that you don't know that it is loading until it has finished loading. And if RunKit is down for some reason, we have no examples to show. That's why I would like to replace the

<div data-example-id="fakes-11-lastArg"></div>

with something like

@includeExample("fakes-11-lastArg")

that would produce something like

<div data-example-id="fakes-11-lastArg">
<!-- some syntax colouring tag here -->
require("@fatso83/mini-mocha").install();
const sinon = require("sinon");
const referee = require("@sinonjs/referee");
const assert = referee.assert;

describe("FakeTest", function () {
    it("should have working lastArg", function () {
        const f = sinon.fake();
        const date1 = new Date();
        const date2 = new Date();

        f(1, 2, date1);
        f(1, 2, date2);

        assert.isTrue(f.lastArg === date2);
        // spy call methods:
        assert.isTrue(f.getCall(0).lastArg === date1);
        assert.isTrue(f.getCall(1).lastArg === date2);
        assert.isTrue(f.lastCall.lastArg === date2);
    });
});
</div>

That would make it show working examples even if javascript should crash or the RunKit service being down.

[fatso83]

P.S. That is a different PR, btw 😄

[srknzl]

So includeExample macro(is it called macro?) does not exists and should be implemented in a new PR? Also, did not fully get how it will work. Does it copy from examples folder and use the code as fallback mechanism to Runkit?

[fatso83]

Does it copy from examples folder and use the code as fallback mechanism to Runkit?

Exactly!

TBH, it's probably not worth the (not so big) effort of creating a Liquid Tag (a Tag is the name the Liquid templating system calls what you called a macro). All I was thinking about was something like just using relative_include to include the source verbatim, but if you want to have a look at how it works under the hood, it's not that heavy: https://jekyllrb.com/docs/plugins/tags/

The least effort way (without creating a Tag) is probably just doing something manual like

<div data-example-id="fakes-11-lastArg">
{% include_relative examples/fakes-11-lastArg.test.js %}
</div>

As you see, there is some repetition, making it easy to make mistakes, and it does not solve how to add syntax highlighing for the fallback, but maybe it's good enough for a fallback?