Fix: async property of scripts is not assigned properly

src/HelmetConstants.js

@@ -30,7 +30,8 @@ export const TAG_PROPERTIES = {
     PROPERTY: "property",
     REL: "rel",
     SRC: "src",
-    TARGET: "target"
+    TARGET: "target",
+    ASYNC: "async"
 };
 
 export const REACT_TAG_MAP = {

src/HelmetUtils.js

@@ -454,6 +454,14 @@ const updateTags = (type, tags) => {
                                 : tag[attribute];
                         newElement.setAttribute(attribute, value);
                     }
+
+                    // The async attribute is ignored on dynamic scripts, the property must be set directly
+                    if (
+                        attribute === TAG_PROPERTIES.ASYNC &&
+                        typeof tag.async === "boolean"
+                    ) {
+                        newElement.async = tag.async;
+                    }
                 }
             }
 

test/HelmetDeclarativeTest.js

@@ -3732,5 +3732,34 @@ describe("Helmet - Declarative API", () => {
                 done();
             });
         });
+
+        it("correctly assigns the async property to a script tag", done => {
+            const spy = sinon.spy();
+            ReactDOM.render(
+                <Helmet
+                    script={[
+                        {
+                            src: "http://localhost/test.js",
+                            type: "text/javascript",
+                            async: false
+                        }
+                    ]}
+                    onChangeClientState={spy}
+                />,
+                container
+            );
+
+            requestAnimationFrame(() => {
+                expect(spy.called).to.equal(true);
+
+                const [, addedTags] = spy.getCall(0).args;
+
+                expect(addedTags).to.have.property("scriptTags");
+                expect(addedTags.scriptTags).to.have.deep.property("[0]");
+                expect(addedTags.scriptTags[0].async).to.equal(false);
+
+                done();
+            });
+        });
     });
 });

test/HelmetTest.js

@@ -3399,5 +3399,34 @@ describe("Helmet", () => {
                 done();
             });
         });
+
+        it("correctly assigns the async property to a script tag", done => {
+            const spy = sinon.spy();
+            ReactDOM.render(
+                <Helmet
+                    script={[
+                        {
+                            src: "http://localhost/test.js",
+                            type: "text/javascript",
+                            async: false
+                        }
+                    ]}
+                    onChangeClientState={spy}
+                />,
+                container
+            );
+
+            requestAnimationFrame(() => {
+                expect(spy.called).to.equal(true);
+
+                const [, addedTags] = spy.getCall(0).args;
+
+                expect(addedTags).to.have.property("scriptTags");
+                expect(addedTags.scriptTags).to.have.deep.property("[0]");
+                expect(addedTags.scriptTags[0].async).to.equal(false);
+
+                done();
+            });
+        });
     });
 });