diff --git a/app/frontend/vendor/outerHTML.js b/app/frontend/vendor/outerHTML.js
new file mode 100644
index 000000000..11398a71f
--- /dev/null
+++ b/app/frontend/vendor/outerHTML.js
@@ -0,0 +1,75 @@
+/*
+ * outerHTML.js
+ * Cross-browser full HTMLElement.outerHTML implementation.
+ *
+ * 2011-11-14
+ *
+ * By Eli Grey, http://eligrey.com
+ * Public Domain.
+ * NO WARRANTY EXPRESSED OR IMPLIED. USE AT YOUR OWN RISK.
+ */
+
+if (typeof document !== "undefined" && !("outerHTML" in document.createElementNS("http://www.w3.org/1999/xhtml", "_"))) {
+
+(function(view) {
+"use strict";
+
+var
+ container = document.createElementNS("http://www.w3.org/1999/xhtml", "_")
+ , elem_proto = (view.HTMLElement || view.Element).prototype
+ , xml_serializer = new XMLSerializer
+ , outerHTML_getter = function() {
+ var
+ node = this
+ , html
+ ;
+ if (document.xmlVersion) {
+ return xml_serializer.serializeToString(node);
+ } else {
+ container.appendChild(node.cloneNode(false));
+ html = container.innerHTML.replace("><", ">" + node.innerHTML + "<");
+ container.innerHTML = "";
+ return html;
+ }
+ }
+ , outerHTML_setter = function(html) {
+ var
+ node = this
+ , parent = node.parentNode
+ , child
+ ;
+ if (parent === null) {
+ DOMException.code = DOMException.NOT_FOUND_ERR;
+ throw DOMException;
+ }
+ container.innerHTML = html;
+ while ((child = container.firstChild)) {
+ parent.insertBefore(child, node);
+ }
+ parent.removeChild(node);
+ }
+;
+
+if (Object.defineProperty) {
+ var outerHTML_prop_desc = {
+ get: outerHTML_getter
+ , set: outerHTML_setter
+ , enumerable: true
+ , configurable: true
+ };
+ try {
+ Object.defineProperty(elem_proto, "outerHTML", outerHTML_prop_desc);
+ } catch (ex) { // IE 8 doesn't support enumerable:true
+ if (ex.number === -0x7FF5EC54) {
+ outerHTML_prop_desc.enumerable = false;
+ Object.defineProperty(elem_proto, "outerHTML", outerHTML_prop_desc);
+ }
+ }
+} else if (Object.prototype.__defineGetter__ && Object.prototype.__defineSetter__) {
+ elem_proto.__defineGetter__("outerHTML", outerHTML_getter);
+ elem_proto.__defineSetter__("outerHTML", outerHTML_setter);
+}
+
+}(self));
+
+}
\ No newline at end of file
diff --git a/app/frontend/vendor/polyfill-output-value.js b/app/frontend/vendor/polyfill-output-value.js
new file mode 100644
index 000000000..70c9cbbf2
--- /dev/null
+++ b/app/frontend/vendor/polyfill-output-value.js
@@ -0,0 +1,14 @@
+if (window.HTMLOutputElement === undefined) {
+ Object.defineProperty(HTMLUnknownElement.prototype, 'value', {
+ get: function () {
+ if (this.tagName === 'OUTPUT') {
+ return this.textContent;
+ }
+ },
+ set: function (newValue) {
+ if (this.tagName === 'OUTPUT') {
+ this.textContent = newValue;
+ }
+ }
+ });
+ }
\ No newline at end of file
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
index 45aaaa511..f47c55cac 100644
--- a/app/views/layouts/application.html.erb
+++ b/app/views/layouts/application.html.erb
@@ -14,6 +14,13 @@
<%= favicon_link_tag asset_path('images/govuk-apple-touch-icon-167x167.png'), rel: 'apple-touch-icon', type: 'image/png', size: '167x167' %>
<%= favicon_link_tag asset_path('images/govuk-apple-touch-icon-180x180.png'), rel: 'apple-touch-icon', type: 'image/png', size: '180x180' %>
<%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
+ <%= javascript_include_tag "vendor/html5shiv.min.js" %>
+ <%= javascript_tag do -%>
+ window.html5.elements = 'output';
+ html5.shivDocument(document);
+ <% end -%>
+ <%= javascript_include_tag "vendor/polyfill-output-value.js" %>
+ <%= javascript_include_tag "vendor/outerHTML.js" %>
<%= javascript_include_tag "application", "data-turbo-track": "reload", defer: true %>
<% if content_for?(:head) %>
diff --git a/babel.config.js b/babel.config.js
index b9dca487c..c6ecf4618 100644
--- a/babel.config.js
+++ b/babel.config.js
@@ -25,7 +25,7 @@ module.exports = function(api) {
{
forceAllTransforms: true,
useBuiltIns: 'entry',
- corejs: 3,
+ corejs: '3.21.1',
modules: false,
exclude: ['transform-typeof-symbol']
}
diff --git a/package.json b/package.json
index ccd2bf0e7..e710c0e30 100644
--- a/package.json
+++ b/package.json
@@ -25,6 +25,7 @@
"custom-event-polyfill": "^1.0.7",
"file-loader": "^6.2.0",
"govuk-frontend": "^4.0.1",
+ "html5shiv": "^3.7.3",
"intersection-observer": "^0.12.0",
"mini-css-extract-plugin": "^2.6.0",
"regenerator-runtime": "^0.13.9",
diff --git a/webpack.config.js b/webpack.config.js
index 5e48d8886..85c9af51a 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -26,9 +26,10 @@ module.exports = {
include: [
path.resolve(__dirname, 'node_modules/@hotwired/stimulus'),
path.resolve(__dirname, 'node_modules/@stimulus/polyfills'),
+ path.resolve(__dirname, 'node_modules/@hotwired/turbo'),
path.resolve(__dirname, 'node_modules/@rails/actioncable'),
path.resolve(__dirname, 'node_modules/chartjs'),
- path.resolve(__dirname, 'app/frontend/controllers'),
+ path.resolve(__dirname, 'app/frontend'),
],
use: ['babel-loader'],
},
@@ -60,6 +61,9 @@ module.exports = {
patterns: [
{ from: "node_modules/govuk-frontend/govuk/assets/images", to: "images" },
{ from: "node_modules/govuk-frontend/govuk/assets/fonts", to: "fonts" },
+ { from: "node_modules/html5shiv/dist/html5shiv.min.js", to: "vendor" },
+ { from: "app/frontend/vendor/outerHTML.js", to: "vendor" },
+ { from: "app/frontend/vendor/polyfill-output-value.js", to: "vendor" }
],
}),
new webpack.ProvidePlugin({
diff --git a/yarn.lock b/yarn.lock
index b6e936ba9..8df66774c 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1842,6 +1842,11 @@ has@^1.0.3:
dependencies:
function-bind "^1.1.1"
+html5shiv@^3.7.3:
+ version "3.7.3"
+ resolved "https://registry.yarnpkg.com/html5shiv/-/html5shiv-3.7.3.tgz#d78a84a367bcb9a710100d57802c387b084631d2"
+ integrity sha1-14qEo2e8uacQEA1XgCw4ewhGMdI=
+
human-signals@^2.1.0:
version "2.1.0"
resolved "https://registry.yarnpkg.com/human-signals/-/human-signals-2.1.0.tgz#dc91fcba42e4d06e4abaed33b3e7a3c02f514ea0"