Use relative imports in components #743

36degrees · 2018-05-31T15:17:38Z

Also introduces a test (failing in 420f674) to ensure that every component can be rendered even when using a different base path for the Nunjucks environment.

Fixes #722

https://trello.com/c/WVfR5Sna/1022-relative-paths-for-nunjucks-imports

Add a failing test that tries to render every component using a different base path for Nunjucks - any imports that assume a particular base path will then throw exceptions.

Also removing a random import from the warning text component where it tries to import itself.

36degrees · 2018-05-31T15:22:51Z

Output from failing tests in 420f674:


Start Server
Server started at http://localhost:8888
Setup Puppeteer
FAIL src/components/all.test.js
  When nunjucks is configured with a different base path
    the back-link component
      ✓ can be rendered without erroring (14ms)
    the breadcrumbs component
      ✓ can be rendered without erroring (3ms)
    the button component
      ✓ can be rendered without erroring (10ms)
    the checkboxes component
      ✕ can be rendered without erroring (29ms)
    the date-input component
      ✕ can be rendered without erroring (18ms)
    the details component
      ✓ can be rendered without erroring (2ms)
    the error-message component
      ✓ can be rendered without erroring (1ms)
    the error-summary component
      ✓ can be rendered without erroring (4ms)
    the fieldset component
      ✓ can be rendered without erroring (3ms)
    the file-upload component
      ✕ can be rendered without erroring (18ms)
    the footer component
      ✓ can be rendered without erroring (4ms)
    the header component
      ✓ can be rendered without erroring (5ms)
    the hint component
      ✓ can be rendered without erroring (2ms)
    the input component
      ✕ can be rendered without erroring (13ms)
    the inset-text component
      ✓ can be rendered without erroring (11ms)
    the label component
      ✓ can be rendered without erroring (3ms)
    the panel component
      ✓ can be rendered without erroring (3ms)
    the phase-banner component
      ✕ can be rendered without erroring (8ms)
    the radios component
      ✕ can be rendered without erroring (19ms)
    the select component
      ✕ can be rendered without erroring (8ms)
    the skip-link component
      ✓ can be rendered without erroring (1ms)
    the table component
      ✓ can be rendered without erroring (4ms)
    the tag component
      ✓ can be rendered without erroring (2ms)
    the textarea component
      ✕ can be rendered without erroring (10ms)
    the warning-text component
      ✕ can be rendered without erroring (6ms)

  ● When nunjucks is configured with a different base path › the checkboxes component › can be rendered without erroring

    expect(function).not.toThrow()
    
    Expected the function not to throw an error.
    Instead, it threw:
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/checkboxes/template.njk)
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/checkboxes/template.njk)
      Error: template not found: error-message/macro.njk      
      
      at Object.<anonymous>.exports.prettifyError (node_modules/nunjucks/src/lib.js:34:15)
      at node_modules/nunjucks/src/environment.js:489:31
      at new_cls.root [as rootRenderFunc] (eval at _compile (node_modules/nunjucks/src/environment.js:568:24), <anonymous>:358:3)
      at new_cls.render (node_modules/nunjucks/src/environment.js:482:15)
      at node_modules/nunjucks/src/environment.js:313:35
      at createTemplate (node_modules/nunjucks/src/environment.js:235:25)
      at handle (node_modules/nunjucks/src/environment.js:250:25)
      at node_modules/nunjucks/src/environment.js:264:21
      at next (node_modules/nunjucks/src/lib.js:207:13)
      at Object.<anonymous>.exports.asyncIter (node_modules/nunjucks/src/lib.js:214:5)
      at new_cls.getTemplate (node_modules/nunjucks/src/environment.js:243:17)
      at new_cls.render (node_modules/nunjucks/src/environment.js:305:14)
      at Object.<anonymous>.module.exports.render (node_modules/nunjucks/index.js:72:14)
      at expect (src/components/all.test.js:22:20)
      at Object.<anonymous> (node_modules/expect/build/to_throw_matchers.js:43:7)
      at Object.throwingMatcher [as toThrow] (node_modules/expect/build/index.js:214:24)
      at Object.it (src/components/all.test.js:23:16)
      at Object.it (src/components/all.test.js:23:16)

  ● When nunjucks is configured with a different base path › the date-input component › can be rendered without erroring

    expect(function).not.toThrow()
    
    Expected the function not to throw an error.
    Instead, it threw:
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/date-input/template.njk)
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/date-input/template.njk)
      Error: template not found: error-message/macro.njk      
      
      at Object.<anonymous>.exports.prettifyError (node_modules/nunjucks/src/lib.js:34:15)
      at node_modules/nunjucks/src/environment.js:489:31
      at new_cls.root [as rootRenderFunc] (eval at _compile (node_modules/nunjucks/src/environment.js:568:24), <anonymous>:254:3)
      at new_cls.render (node_modules/nunjucks/src/environment.js:482:15)
      at node_modules/nunjucks/src/environment.js:313:35
      at createTemplate (node_modules/nunjucks/src/environment.js:235:25)
      at handle (node_modules/nunjucks/src/environment.js:250:25)
      at node_modules/nunjucks/src/environment.js:264:21
      at next (node_modules/nunjucks/src/lib.js:207:13)
      at Object.<anonymous>.exports.asyncIter (node_modules/nunjucks/src/lib.js:214:5)
      at new_cls.getTemplate (node_modules/nunjucks/src/environment.js:243:17)
      at new_cls.render (node_modules/nunjucks/src/environment.js:305:14)
      at Object.<anonymous>.module.exports.render (node_modules/nunjucks/index.js:72:14)
      at expect (src/components/all.test.js:22:20)
      at Object.<anonymous> (node_modules/expect/build/to_throw_matchers.js:43:7)
      at Object.throwingMatcher [as toThrow] (node_modules/expect/build/index.js:214:24)
      at Object.it (src/components/all.test.js:23:16)
      at Object.it (src/components/all.test.js:23:16)

  ● When nunjucks is configured with a different base path › the file-upload component › can be rendered without erroring

    expect(function).not.toThrow()
    
    Expected the function not to throw an error.
    Instead, it threw:
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/file-upload/template.njk)
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/file-upload/template.njk)
      Error: template not found: error-message/macro.njk      
      
      at Object.<anonymous>.exports.prettifyError (node_modules/nunjucks/src/lib.js:34:15)
      at node_modules/nunjucks/src/environment.js:489:31
      at new_cls.root [as rootRenderFunc] (eval at _compile (node_modules/nunjucks/src/environment.js:568:24), <anonymous>:193:3)
      at new_cls.render (node_modules/nunjucks/src/environment.js:482:15)
      at node_modules/nunjucks/src/environment.js:313:35
      at createTemplate (node_modules/nunjucks/src/environment.js:235:25)
      at handle (node_modules/nunjucks/src/environment.js:250:25)
      at node_modules/nunjucks/src/environment.js:264:21
      at next (node_modules/nunjucks/src/lib.js:207:13)
      at Object.<anonymous>.exports.asyncIter (node_modules/nunjucks/src/lib.js:214:5)
      at new_cls.getTemplate (node_modules/nunjucks/src/environment.js:243:17)
      at new_cls.render (node_modules/nunjucks/src/environment.js:305:14)
      at Object.<anonymous>.module.exports.render (node_modules/nunjucks/index.js:72:14)
      at expect (src/components/all.test.js:22:20)
      at Object.<anonymous> (node_modules/expect/build/to_throw_matchers.js:43:7)
      at Object.throwingMatcher [as toThrow] (node_modules/expect/build/index.js:214:24)
      at Object.it (src/components/all.test.js:23:16)
      at Object.it (src/components/all.test.js:23:16)

  ● When nunjucks is configured with a different base path › the input component › can be rendered without erroring

    expect(function).not.toThrow()
    
    Expected the function not to throw an error.
    Instead, it threw:
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/input/template.njk)
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/input/template.njk)
      Error: template not found: error-message/macro.njk      
      
      at Object.<anonymous>.exports.prettifyError (node_modules/nunjucks/src/lib.js:34:15)
      at node_modules/nunjucks/src/environment.js:489:31
      at new_cls.root [as rootRenderFunc] (eval at _compile (node_modules/nunjucks/src/environment.js:568:24), <anonymous>:195:3)
      at new_cls.render (node_modules/nunjucks/src/environment.js:482:15)
      at node_modules/nunjucks/src/environment.js:313:35
      at createTemplate (node_modules/nunjucks/src/environment.js:235:25)
      at handle (node_modules/nunjucks/src/environment.js:250:25)
      at node_modules/nunjucks/src/environment.js:264:21
      at next (node_modules/nunjucks/src/lib.js:207:13)
      at Object.<anonymous>.exports.asyncIter (node_modules/nunjucks/src/lib.js:214:5)
      at new_cls.getTemplate (node_modules/nunjucks/src/environment.js:243:17)
      at new_cls.render (node_modules/nunjucks/src/environment.js:305:14)
      at Object.<anonymous>.module.exports.render (node_modules/nunjucks/index.js:72:14)
      at expect (src/components/all.test.js:22:20)
      at Object.<anonymous> (node_modules/expect/build/to_throw_matchers.js:43:7)
      at Object.throwingMatcher [as toThrow] (node_modules/expect/build/index.js:214:24)
      at Object.it (src/components/all.test.js:23:16)
      at Object.it (src/components/all.test.js:23:16)

  ● When nunjucks is configured with a different base path › the phase-banner component › can be rendered without erroring

    expect(function).not.toThrow()
    
    Expected the function not to throw an error.
    Instead, it threw:
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/phase-banner/template.njk)
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/phase-banner/template.njk)
      Error: template not found: tag/macro.njk      
      
      at Object.<anonymous>.exports.prettifyError (node_modules/nunjucks/src/lib.js:34:15)
      at node_modules/nunjucks/src/environment.js:489:31
      at new_cls.root [as rootRenderFunc] (eval at _compile (node_modules/nunjucks/src/environment.js:568:24), <anonymous>:86:3)
      at new_cls.render (node_modules/nunjucks/src/environment.js:482:15)
      at node_modules/nunjucks/src/environment.js:313:35
      at createTemplate (node_modules/nunjucks/src/environment.js:235:25)
      at handle (node_modules/nunjucks/src/environment.js:250:25)
      at node_modules/nunjucks/src/environment.js:264:21
      at next (node_modules/nunjucks/src/lib.js:207:13)
      at Object.<anonymous>.exports.asyncIter (node_modules/nunjucks/src/lib.js:214:5)
      at new_cls.getTemplate (node_modules/nunjucks/src/environment.js:243:17)
      at new_cls.render (node_modules/nunjucks/src/environment.js:305:14)
      at Object.<anonymous>.module.exports.render (node_modules/nunjucks/index.js:72:14)
      at expect (src/components/all.test.js:22:20)
      at Object.<anonymous> (node_modules/expect/build/to_throw_matchers.js:43:7)
      at Object.throwingMatcher [as toThrow] (node_modules/expect/build/index.js:214:24)
      at Object.it (src/components/all.test.js:23:16)
      at Object.it (src/components/all.test.js:23:16)

  ● When nunjucks is configured with a different base path › the radios component › can be rendered without erroring

    expect(function).not.toThrow()
    
    Expected the function not to throw an error.
    Instead, it threw:
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/radios/template.njk)
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/radios/template.njk)
      Error: template not found: error-message/macro.njk      
      
      at Object.<anonymous>.exports.prettifyError (node_modules/nunjucks/src/lib.js:34:15)
      at node_modules/nunjucks/src/environment.js:489:31
      at new_cls.root [as rootRenderFunc] (eval at _compile (node_modules/nunjucks/src/environment.js:568:24), <anonymous>:348:3)
      at new_cls.render (node_modules/nunjucks/src/environment.js:482:15)
      at node_modules/nunjucks/src/environment.js:313:35
      at createTemplate (node_modules/nunjucks/src/environment.js:235:25)
      at handle (node_modules/nunjucks/src/environment.js:250:25)
      at node_modules/nunjucks/src/environment.js:264:21
      at next (node_modules/nunjucks/src/lib.js:207:13)
      at Object.<anonymous>.exports.asyncIter (node_modules/nunjucks/src/lib.js:214:5)
      at new_cls.getTemplate (node_modules/nunjucks/src/environment.js:243:17)
      at new_cls.render (node_modules/nunjucks/src/environment.js:305:14)
      at Object.<anonymous>.module.exports.render (node_modules/nunjucks/index.js:72:14)
      at expect (src/components/all.test.js:22:20)
      at Object.<anonymous> (node_modules/expect/build/to_throw_matchers.js:43:7)
      at Object.throwingMatcher [as toThrow] (node_modules/expect/build/index.js:214:24)
      at Object.it (src/components/all.test.js:23:16)
      at Object.it (src/components/all.test.js:23:16)

  ● When nunjucks is configured with a different base path › the select component › can be rendered without erroring

    expect(function).not.toThrow()
    
    Expected the function not to throw an error.
    Instead, it threw:
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/select/template.njk)
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/select/template.njk)
      Error: template not found: error-message/macro.njk      
      
      at Object.<anonymous>.exports.prettifyError (node_modules/nunjucks/src/lib.js:34:15)
      at node_modules/nunjucks/src/environment.js:489:31
      at new_cls.root [as rootRenderFunc] (eval at _compile (node_modules/nunjucks/src/environment.js:568:24), <anonymous>:213:3)
      at new_cls.render (node_modules/nunjucks/src/environment.js:482:15)
      at node_modules/nunjucks/src/environment.js:313:35
      at createTemplate (node_modules/nunjucks/src/environment.js:235:25)
      at handle (node_modules/nunjucks/src/environment.js:250:25)
      at node_modules/nunjucks/src/environment.js:264:21
      at next (node_modules/nunjucks/src/lib.js:207:13)
      at Object.<anonymous>.exports.asyncIter (node_modules/nunjucks/src/lib.js:214:5)
      at new_cls.getTemplate (node_modules/nunjucks/src/environment.js:243:17)
      at new_cls.render (node_modules/nunjucks/src/environment.js:305:14)
      at Object.<anonymous>.module.exports.render (node_modules/nunjucks/index.js:72:14)
      at expect (src/components/all.test.js:22:20)
      at Object.<anonymous> (node_modules/expect/build/to_throw_matchers.js:43:7)
      at Object.throwingMatcher [as toThrow] (node_modules/expect/build/index.js:214:24)
      at Object.it (src/components/all.test.js:23:16)
      at Object.it (src/components/all.test.js:23:16)

  ● When nunjucks is configured with a different base path › the textarea component › can be rendered without erroring

    expect(function).not.toThrow()
    
    Expected the function not to throw an error.
    Instead, it threw:
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/textarea/template.njk)
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/textarea/template.njk)
      Error: template not found: error-message/macro.njk      
      
      at Object.<anonymous>.exports.prettifyError (node_modules/nunjucks/src/lib.js:34:15)
      at node_modules/nunjucks/src/environment.js:489:31
      at new_cls.root [as rootRenderFunc] (eval at _compile (node_modules/nunjucks/src/environment.js:568:24), <anonymous>:191:3)
      at new_cls.render (node_modules/nunjucks/src/environment.js:482:15)
      at node_modules/nunjucks/src/environment.js:313:35
      at createTemplate (node_modules/nunjucks/src/environment.js:235:25)
      at handle (node_modules/nunjucks/src/environment.js:250:25)
      at node_modules/nunjucks/src/environment.js:264:21
      at next (node_modules/nunjucks/src/lib.js:207:13)
      at Object.<anonymous>.exports.asyncIter (node_modules/nunjucks/src/lib.js:214:5)
      at new_cls.getTemplate (node_modules/nunjucks/src/environment.js:243:17)
      at new_cls.render (node_modules/nunjucks/src/environment.js:305:14)
      at Object.<anonymous>.module.exports.render (node_modules/nunjucks/index.js:72:14)
      at expect (src/components/all.test.js:22:20)
      at Object.<anonymous> (node_modules/expect/build/to_throw_matchers.js:43:7)
      at Object.throwingMatcher [as toThrow] (node_modules/expect/build/index.js:214:24)
      at Object.it (src/components/all.test.js:23:16)
      at Object.it (src/components/all.test.js:23:16)

  ● When nunjucks is configured with a different base path › the warning-text component › can be rendered without erroring

    expect(function).not.toThrow()
    
    Expected the function not to throw an error.
    Instead, it threw:
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/warning-text/template.njk)
      Template render error: (/Users/ollie/Gds/govuk-frontend/src/components/warning-text/template.njk)
      Error: template not found: warning-text/macro.njk      
      
      at Object.<anonymous>.exports.prettifyError (node_modules/nunjucks/src/lib.js:34:15)
      at node_modules/nunjucks/src/environment.js:489:31
      at new_cls.root [as rootRenderFunc] (eval at _compile (node_modules/nunjucks/src/environment.js:568:24), <anonymous>:82:3)
      at new_cls.render (node_modules/nunjucks/src/environment.js:482:15)
      at node_modules/nunjucks/src/environment.js:313:35
      at createTemplate (node_modules/nunjucks/src/environment.js:235:25)
      at handle (node_modules/nunjucks/src/environment.js:250:25)
      at node_modules/nunjucks/src/environment.js:264:21
      at next (node_modules/nunjucks/src/lib.js:207:13)
      at Object.<anonymous>.exports.asyncIter (node_modules/nunjucks/src/lib.js:214:5)
      at new_cls.getTemplate (node_modules/nunjucks/src/environment.js:243:17)
      at new_cls.render (node_modules/nunjucks/src/environment.js:305:14)
      at Object.<anonymous>.module.exports.render (node_modules/nunjucks/index.js:72:14)
      at expect (src/components/all.test.js:22:20)
      at Object.<anonymous> (node_modules/expect/build/to_throw_matchers.js:43:7)
      at Object.throwingMatcher [as toThrow] (node_modules/expect/build/index.js:214:24)
      at Object.it (src/components/all.test.js:23:16)
      at Object.it (src/components/all.test.js:23:16)

Test Suites: 1 failed, 1 total
Tests:       9 failed, 16 passed, 25 total
Snapshots:   0 total
Time:        1.896s
Ran all test suites matching /src\/components\/all.test.js/i.
Teardown Puppeteer
Close server

NickColley

Nice work, tests makes sense, fix makes sense. 👍

- Add missing changelog entry for #743 - Correct PR numbers for #742 - Correct markdown syntax for PR links 🤦‍♂️

govuk-design-system-ci temporarily deployed to govuk-frontend-review-pr-743 May 31, 2018 15:17 Inactive

36degrees added 2 commits May 31, 2018 16:18

Add test to ensure components can be imported

420f674

Add a failing test that tries to render every component using a different base path for Nunjucks - any imports that assume a particular base path will then throw exceptions.

Fix failing tests by using relative imports

a57c784

Also removing a random import from the warning text component where it tries to import itself.

36degrees force-pushed the use-relative-imports-in-components branch from afa3cb7 to a57c784 Compare May 31, 2018 15:18

govuk-design-system-ci deployed to govuk-frontend-review-pr-743 May 31, 2018 15:19 View deployment

NickColley approved these changes May 31, 2018

View reviewed changes

36degrees merged commit a808f16 into master May 31, 2018

36degrees deleted the use-relative-imports-in-components branch May 31, 2018 15:28

36degrees added a commit that referenced this pull request May 31, 2018

Fix several issues with the changelog

a930de0

- Add missing changelog entry for #743 - Correct PR numbers for #742 - Correct markdown syntax for PR links 🤦‍♂️

36degrees mentioned this pull request May 31, 2018

Fix several issues with the changelog #744

Merged

hannalaakso mentioned this pull request Jun 14, 2018

Release v0.0.32 #791

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Use relative imports in components #743

Use relative imports in components #743

36degrees commented May 31, 2018 •

edited

Loading

36degrees commented May 31, 2018

NickColley left a comment

Use relative imports in components #743

Use relative imports in components #743

Conversation

36degrees commented May 31, 2018 • edited Loading

36degrees commented May 31, 2018

NickColley left a comment

Choose a reason for hiding this comment

36degrees commented May 31, 2018 •

edited

Loading