Skip to content
This repository has been archived by the owner on Jun 21, 2022. It is now read-only.

Provide tests for svginfo #690

Merged
merged 2 commits into from Apr 16, 2018
Merged

Provide tests for svginfo #690

merged 2 commits into from Apr 16, 2018

Conversation

JeremiePat
Copy link
Contributor

Here are some test for the current state of {{svginfo}}

They cover:

  • calling svginfo in preview mode
  • calling svginfo for non existent SVG element
  • calling svginfo with an explicit parameter
  • calling svginfo with an implicit parameter (based on the page slug)
  • checking the various type of linking for categories and permitted contents

Note: This should be reviewed and merged before PR #670 that introduce changes to svginfo

@escattone escattone self-assigned this Apr 13, 2018
@escattone escattone self-requested a review April 13, 2018 17:27
Copy link
Contributor

@escattone escattone left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nice work @JeremiePat! This is nicely organized and thorough. I have requested changes, but the only one that's required is the addition of the stub for wiki.pageExists. You can do with the whitespace comments as you wish.

Thanks @JeremiePat!

const SVG_BASE_SLUG = 'docs/Web/SVG';
const SVG_DATA = require('../../macros/SVGData.json');
const L10N_COMMON = require('../../macros/L10n-Common.json');
const L10N_SVG = require('../../macros/L10n-SVG.json');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think we follow a JavaScript style guide yet (@schalkneethling is working on one), but I would prefer each = in lines 14-16 to be preceded by only a single space (and not aligned as they are).

const SEPARATOR = _('listSeparator', locale);
const CATEGORIES = _('categories', locale);
const CONTENT = _('permittedContent', locale);
const DESCRIPTION = _(data.content.description, locale);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Another small whitespace thing again, but I would prefer only a single space before each = and after each ,.

output: makeExpect(SVG_DATA.elements.defs)
},{
// altGlyphDef allows to test when description is an object rather than a string
title: 'Test implicite slug (no param, slug: /en-US/docs/Web/SVG/Element/altGlyphDef)',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Spelling: implicite should be implicit

output: '<span style="color:red;">missing</span>'
},{
// Defs allows to test multiple category and a mix of groups and elements for permitted contents
title: 'Test explicite slug (param: defs)',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Spelling: explicite should be explicit

slug: URL('en-US', SVG_BASE_SLUG, 'Element', 'altGlyphDef')
}
},{
title: 'Test implicite non English slug (no param, slug: /zh-CN/docs/Web/SVG/Element/defs)',
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Spelling: implicite should be implicit

//
// NOTE: we could probably make that more generic by having a single test
// runner (see below) and a bunch of JSON files (one per macro) to
// describe all the possible inputs and their expected outputs.
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

On further reflection, in order for this approach to be used for more general testing, the definition of each test case would also have to include its beforeEachMacro set-up (creating and populating the stubs for example), which seems difficult to standardize.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Indeed, at that point I need to get into more testing to see what can be standardize (and how) and what cannot and how is it possible to neatly handle special edge case. Those notes are here to remember to have further discussion when we will have more tests.

const { url, data } = MOCK_PAGES['zh-CN'][key];
macro.ctx.wiki.getPage.withArgs(url).returns(data);
});
});
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is nicely done, but it's missing the stub for the wiki.pageExists call that is made within the SVGElement macro (via the call to template("SVGElement"... made in one of the paths through the svginfo macro). The way the test runs currently, it's making an actual network request via the real wiki.pageExists. Something like this worked for me during my testing:

    beforeEachMacro((macro) => {
        // let's make sure we have clean calls to wiki.getPage
        macro.ctx.wiki.getPage = sinon.stub();
        macro.ctx.wiki.pageExists = sinon.stub();

        Object.keys(MOCK_PAGES['en-US']).forEach((key) => {
            const { url, data } = MOCK_PAGES['en-US'][key];
            macro.ctx.wiki.getPage.withArgs(url).returns(data);
            macro.ctx.wiki.pageExists.withArgs(url).returns(true);
        });

        Object.keys(MOCK_PAGES['zh-CN']).forEach((key) => {
            const { url, data } = MOCK_PAGES['zh-CN'][key];
            macro.ctx.wiki.getPage.withArgs(url).returns(data);
            macro.ctx.wiki.pageExists.withArgs(url).returns(true);
        });
    });

This reminds me that I need to submit a PR that stubs the request package within the macro.ctx object, so that it throws an error when called. I think that would be the best way to catch all of the attempts to make real network calls, and help us discover what we need to stub.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's been a while since I've worked with the test framework, as I forgot that I had already stubbed the request package long ago in #240! 🤦‍♂️

So your tests were not making real network calls, sorry! I still think it's best to create and populate the stub for wiki.pageExists instead of relying on whatever wiki.pageExists returns using the un-populated request stub.

let { elements, groups } = data.content.elements.reduce((acc, value) => {
if (value.indexOf('&lt;') !== -1) {
let key = value.replace(/&lt;|&gt;/g, '');
let url = URL(locale, SVG_BASE_SLUG, 'Element', key);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Whitespace again: I would prefer only a single space before each =.

} else {
let anchor = "#" + camelToSnake(value);
let url = URL(locale, SVG_BASE_SLUG, 'Element') + anchor;
let label = _(value, locale);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Whitespace again: I would prefer only a single space before each =.

}, {elements: [], groups: []});

// Named groups must be listed first (each on new lines)
if (groups.length > 0) permittedContent.push(groups.join('<br/>'));
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Whitespace again: I would prefer only a single space before the >.

@JeremiePat
Copy link
Contributor Author

It should be better now.

For wiki.pageExists I follow @escattone recommendation as we do not need anything more clever than that in that case.

For the white space, I made the changes even if I'm someone who is very sensitive to vertical alignment but I don't want to fight on this.

Copy link
Contributor

@escattone escattone left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks @JeremiePat, this looks great, thanks again for creating these new comprehensive tests for the svginfo macro! Feel free to ignore my whitespace preferences in the future! 😃

@escattone escattone merged commit ad7448f into mdn:master Apr 16, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants