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

Provide tests for svginfo #690

Merged
merged 2 commits into from Apr 16, 2018

Conversation

Projects
None yet
2 participants
@JeremiePat
Copy link
Contributor

JeremiePat commented Apr 12, 2018

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 Apr 13, 2018

@escattone
Copy link
Member

escattone left a comment

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');

This comment has been minimized.

@escattone

escattone Apr 13, 2018

Member

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);

This comment has been minimized.

@escattone

escattone Apr 13, 2018

Member

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)',

This comment has been minimized.

@escattone

escattone Apr 13, 2018

Member

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)',

This comment has been minimized.

@escattone

escattone Apr 13, 2018

Member

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)',

This comment has been minimized.

@escattone

escattone Apr 13, 2018

Member

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.

This comment has been minimized.

@escattone

escattone Apr 13, 2018

Member

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.

This comment has been minimized.

@JeremiePat

JeremiePat Apr 16, 2018

Author Contributor

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);
});
});

This comment has been minimized.

@escattone

escattone Apr 13, 2018

Member

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.

This comment has been minimized.

@escattone

escattone Apr 14, 2018

Member

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);

This comment has been minimized.

@escattone

escattone Apr 13, 2018

Member

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);

This comment has been minimized.

@escattone

escattone Apr 13, 2018

Member

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/>'));

This comment has been minimized.

@escattone

escattone Apr 13, 2018

Member

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

@JeremiePat

This comment has been minimized.

Copy link
Contributor Author

JeremiePat commented Apr 16, 2018

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.

@escattone
Copy link
Member

escattone left a comment

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

1 check passed

continuous-integration/travis-ci/pr The Travis CI build passed
Details
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.