Fix overeager instantation of govuk-frontend js

CHANGELOG.md

@@ -6,16 +6,25 @@
 
 #### Features
 
-- Updated to govuk-frontend@3.11.0
-  - See https://github.com/alphagov/govuk-frontend/releases/tag/v3.11.0 for full release notes
-  - Cookie banner component added
-
 #### Breaking changes
 
 ---
 
 ## Releases
 
+### v5.1.0
+
+#### Fixes
+
+- Fix overeager instantiation of govuk JS (https://github.com/surevine/govuk-react-jsx/pull/110)
+  - Fixes https://github.com/surevine/govuk-react-jsx/issues/99
+
+#### Features
+
+- Updated to govuk-frontend@3.11.0
+  - See https://github.com/alphagov/govuk-frontend/releases/tag/v3.11.0 for full release notes
+  - Cookie banner component added
+
 ### v5.0.0
 
 - Further ErrorSummary focusing fixes

package.json

@@ -1,6 +1,6 @@
 {
   "name": "govuk-react-jsx",
-  "version": "5.0.0",
+  "version": "5.1.0",
   "description": "React component ports of govuk-frontend nunjucks macros. Directly consuming govuk-frontend CSS & JS.",
   "main": "src/govuk/index.js",
   "scripts": {

src/govuk/components/accordion/index.js

@@ -14,7 +14,9 @@ function Accordion(props) {
           'govuk-frontend/govuk/components/accordion/accordion'
         );
 
-        new AccordionJS(accordionRef.current).init();
+        if (accordionRef.current) {
+          new AccordionJS(accordionRef.current).init();
+        }
       }
     })();
   }, [accordionRef]);

src/govuk/components/button/index.js

@@ -37,7 +37,9 @@ const Button = React.forwardRef((props, ref) => {
           'govuk-frontend/govuk/components/button/button'
         );
 
-        new ButtonJS(buttonRef.current).init();
+        if (buttonRef.current) {
+          new ButtonJS(buttonRef.current).init();
+        }
       }
     })();
   }, [buttonRef]);

src/govuk/components/character-count/index.js

@@ -26,7 +26,9 @@ const CharacterCount = React.forwardRef((props, ref) => {
           'govuk-frontend/govuk/components/character-count/character-count'
         );
 
-        new CharacterCountJS(characterCountRef.current).init();
+        if (characterCountRef.current) {
+          new CharacterCountJS(characterCountRef.current).init();
+        }
       }
     })();
   }, [characterCountRef]);

src/govuk/components/error-summary/index.js

@@ -23,12 +23,14 @@ const ErrorSummary = React.forwardRef((props, ref) => {
           'govuk-frontend/govuk/components/error-summary/error-summary'
         );
 
-        // Just bind the click event handlers from the gov error summary
-        // This is because we don't want to focus by default - that's up to the calling app
-        errorSummaryRef.current.addEventListener(
-          'click',
-          ErrorSummaryJS.prototype.handleClick.bind(ErrorSummaryJS.prototype)
-        );
+        if (errorSummaryRef.current) {
+          // Just bind the click event handlers from the gov error summary
+          // This is because we don't want to focus by default - that's up to the calling app
+          errorSummaryRef.current.addEventListener(
+            'click',
+            ErrorSummaryJS.prototype.handleClick.bind(ErrorSummaryJS.prototype)
+          );
+        }
       }
     })();
   }, [errorSummaryRef]);

src/govuk/components/header/index.js

@@ -36,7 +36,9 @@ function Header(props) {
           'govuk-frontend/govuk/components/header/header'
         );
 
-        new HeaderJS(headerRef.current).init();
+        if (headerRef.current) {
+          new HeaderJS(headerRef.current).init();
+        }
       }
     })();
   }, [headerRef]);

src/govuk/components/notification-banner/index.js

@@ -25,7 +25,9 @@ function NotificationBanner(props) {
           'govuk-frontend/govuk/components/notification-banner/notification-banner'
         );
 
-        new NotificationBannerJS(notificationBannerRef.current).init();
+        if (notificationBannerRef.current) {
+          new NotificationBannerJS(notificationBannerRef.current).init();
+        }
       }
     })();
   }, [notificationBannerRef]);

src/govuk/components/tabs/index.js

@@ -15,7 +15,9 @@ function Tabs(props) {
           'govuk-frontend/govuk/components/tabs/tabs'
         );
 
-        new TabsJS(tabsRef.current).init();
+        if (tabsRef.current) {
+          new TabsJS(tabsRef.current).init();
+        }
       }
     })();
   }, [tabsRef]);