Skip to content

Commit

Permalink
Merge pull request #2146 from alphagov/use-esm
Browse files Browse the repository at this point in the history
Use ESM modules from GOV.UK Frontend
  • Loading branch information
36degrees authored May 18, 2022
2 parents f5a7be2 + 48fc4d0 commit a67e3c6
Show file tree
Hide file tree
Showing 8 changed files with 24 additions and 87 deletions.
4 changes: 1 addition & 3 deletions src/javascripts/application-ie8.js
Original file line number Diff line number Diff line change
@@ -1,10 +1,8 @@
import common from 'govuk-frontend/govuk/common'
import { nodeListForEach } from './components/helpers.js'
import Example from './components/example.js'
import AppTabs from './components/tabs.js'
import OptionsTable from './components/options-table.js'

var nodeListForEach = common.nodeListForEach

// Initialise example frames
var $examples = document.querySelectorAll('[data-module="app-example-frame"]')
nodeListForEach($examples, function ($example) {
Expand Down
4 changes: 1 addition & 3 deletions src/javascripts/application.js
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import CookieBanner from './components/cookie-banner.js'
import BackToTop from './components/back-to-top.js'
import common from 'govuk-frontend/govuk/common'
import { nodeListForEach } from './components/helpers.js'
import Example from './components/example.js'
import AppTabs from './components/tabs.js'
import Copy from './components/copy.js'
Expand All @@ -11,8 +11,6 @@ import { getConsentCookie, isValidConsentCookie } from './components/cookie-func
import Analytics from './components/analytics.js'
import CookiesPage from './components/cookies-page.js'

var nodeListForEach = common.nodeListForEach

// Initialise cookie banner
var $cookieBanner = document.querySelector('[data-module="govuk-cookie-banner"]')
new CookieBanner($cookieBanner).init()
Expand Down
4 changes: 1 addition & 3 deletions src/javascripts/components/cookie-banner.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,7 @@
import * as CookieFunctions from './cookie-functions.js'
import 'govuk-frontend/govuk/vendor/polyfills/Function/prototype/bind'
import 'govuk-frontend/govuk/vendor/polyfills/Event'
import common from 'govuk-frontend/govuk/common'

var nodeListForEach = common.nodeListForEach
import { nodeListForEach } from './helpers.js'

var cookieBannerAcceptSelector = '.js-cookie-banner-accept'
var cookieBannerRejectSelector = '.js-cookie-banner-reject'
Expand Down
4 changes: 1 addition & 3 deletions src/javascripts/components/cookies-page.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
import { getConsentCookie, setConsentCookie } from './cookie-functions.js'
import common from 'govuk-frontend/govuk/common'

var nodeListForEach = common.nodeListForEach
import { nodeListForEach } from './helpers.js'

function CookiesPage ($module) {
this.$module = $module
Expand Down
16 changes: 16 additions & 0 deletions src/javascripts/components/helpers.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
/**
* This seems to fail in IE8, requires more investigation.
* See: https://github.com/imagitama/nodelist-foreach-polyfill
*/
function nodeListForEach (nodes, callback) {
if (window.NodeList.prototype.forEach) {
return nodes.forEach(callback)
}
for (var i = 0; i < nodes.length; i++) {
callback.call(window, nodes[i], i, nodes)
}
}

export {
nodeListForEach
}
4 changes: 1 addition & 3 deletions src/javascripts/components/navigation.js
Original file line number Diff line number Diff line change
@@ -1,7 +1,5 @@
import 'govuk-frontend/govuk/vendor/polyfills/Element/prototype/classList'

import common from 'govuk-frontend/govuk/common'
var nodeListForEach = common.nodeListForEach
import { nodeListForEach } from './helpers.js'

var navActiveClass = 'app-navigation--active'
var navMenuButtonActiveClass = 'govuk-header__menu-button--open'
Expand Down
4 changes: 1 addition & 3 deletions src/javascripts/components/tabs.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,7 @@
import 'govuk-frontend/govuk/vendor/polyfills/Function/prototype/bind'
import 'govuk-frontend/govuk/vendor/polyfills/Element/prototype/classList'
import 'govuk-frontend/govuk/vendor/polyfills/Event'
import common from 'govuk-frontend/govuk/common'

var nodeListForEach = common.nodeListForEach
import { nodeListForEach } from './helpers.js'

var tabsItemClass = 'app-tabs__item'
var tabsItemCurrentClass = tabsItemClass + '--current'
Expand Down
71 changes: 2 additions & 69 deletions src/javascripts/govuk-frontend.js
Original file line number Diff line number Diff line change
@@ -1,69 +1,2 @@
import common from 'govuk-frontend/govuk/common'
import Accordion from 'govuk-frontend/govuk/components/accordion/accordion'
import Button from 'govuk-frontend/govuk/components/button/button'
import Details from 'govuk-frontend/govuk/components/details/details'
import CharacterCount from 'govuk-frontend/govuk/components/character-count/character-count'
import Checkboxes from 'govuk-frontend/govuk/components/checkboxes/checkboxes'
import ErrorSummary from 'govuk-frontend/govuk/components/error-summary/error-summary'
import NotificationBanner from 'govuk-frontend/govuk/components/notification-banner/notification-banner'
import Radios from 'govuk-frontend/govuk/components/radios/radios'
import Header from 'govuk-frontend/govuk/components/header/header'
import Tabs from 'govuk-frontend/govuk/components/tabs/tabs'
import SkipLink from 'govuk-frontend/govuk/components/skip-link/skip-link'

var nodeListForEach = common.nodeListForEach

var $buttons = document.querySelectorAll('[data-module="govuk-button"]')
nodeListForEach($buttons, function ($button) {
new Button($button).init()
})

var $accordions = document.querySelectorAll('[data-module="govuk-accordion"]')
nodeListForEach($accordions, function ($accordion) {
new Accordion($accordion).init()
})

var $details = document.querySelectorAll('[data-module="govuk-details"]')
nodeListForEach($details, function ($detail) {
new Details($detail).init()
})

var $errorSummaries = document.querySelectorAll('[data-module="govuk-error-summary"]')
nodeListForEach($errorSummaries, function ($errorSummary) {
var errorSummary = new ErrorSummary($errorSummary)
errorSummary.init()
})

var $characterCounts = document.querySelectorAll('[data-module="govuk-character-count"]')
nodeListForEach($characterCounts, function ($characterCount) {
new CharacterCount($characterCount).init()
})

var $checkboxes = document.querySelectorAll('[data-module="govuk-checkboxes"]')
nodeListForEach($checkboxes, function ($checkbox) {
new Checkboxes($checkbox).init()
})

var $notificationBanners = document.querySelectorAll('[data-module="govuk-notification-banner"]')
nodeListForEach($notificationBanners, function ($notificationBanner) {
new NotificationBanner($notificationBanner).init()
})

var $radios = document.querySelectorAll('[data-module="govuk-radios"]')
nodeListForEach($radios, function ($radio) {
new Radios($radio).init()
})

var $headers = document.querySelectorAll('[data-module="govuk-header"]')
nodeListForEach($headers, function ($header) {
new Header($header).init()
})

var $tabs = document.querySelectorAll('[data-module="govuk-tabs"]')
nodeListForEach($tabs, function ($tab) {
new Tabs($tab).init()
})

// Find first skip link module to enhance.
var $skipLink = document.querySelector('[data-module="govuk-skip-link"]')
new SkipLink($skipLink).init()
import { initAll } from 'govuk-frontend'
initAll()

0 comments on commit a67e3c6

Please sign in to comment.