Add email validation to EML Party model

src/js/models/metadata/eml211/EMLParty.js

@@ -886,7 +886,7 @@ define(["jquery", "underscore", "backbone", "models/DataONEObject"], function (
           this.get("type") == "associatedParty"
             ? this.get("roles")
             : [this.get("type")];
-        for (role of roles) {
+        for (let role of roles) {
           let requiredFields = MetacatUI.appModel.get(
             "emlEditorRequiredFields_EMLParty",
           )[role];
@@ -899,6 +899,17 @@ define(["jquery", "underscore", "backbone", "models/DataONEObject"], function (
           });
         }
 
+        // If there is an email address, validate it
+        const emailRegex = /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/;
+        const email = this.get("email");
+        if (email?.length) {
+          email.forEach((emailAddress) => {
+            if (!emailAddress.match(emailRegex)) {
+              errors.email = "Provide a valid email address.";
+            }
+          });
+        }
+
         return Object.keys(errors)?.length ? errors : false;
       },
 

src/js/templates/metadata/EMLParty.html

@@ -20,7 +20,8 @@
 	<div class="span4">
 		<div class="row-fluid">
 			<label class="hidden" for="<%=uniqueId%>-email">E-mail</label>
-			<input type="email" id="<%=uniqueId%>-email" name="E-mail" class="span12 tooltip-this" data-attribute="email" placeholder="Email" />
+			<input type="email" id="<%=uniqueId%>-email" name="E-mail" class="span12
+			tooltip-this" data-attribute="email" placeholder="Email" pattern="[^@]+@[^@]+\.[a-zA-Z]{2,6}" />
 		</div>
 		<div class="row-fluid">
 			<label class="hidden" for="<%=uniqueId%>-website">Website</label>

test/js/specs/unit/models/metadata/eml211/EMLParty.spec.js

@@ -1,11 +1,19 @@
+"use strict";
+
 define([
-  "../../../../../../../../src/js/models/metadata/eml211/EMLParty",
-], function (EMLParty) {
+  "/test/js/specs/shared/clean-state.js",
+  "models/metadata/eml211/EMLParty",
+], function (cleanState, EMLParty) {
   // Configure the Chai assertion library
   var should = chai.should();
   var expect = chai.expect;
 
   describe("EMLParty Test Suite", function () {
+    const state = cleanState(() => {
+      const party = new EMLParty();
+      return { party };
+    }, beforeEach);
+
     describe("Creating", function () {
       it("should be created from the logged in user");
     });
@@ -36,6 +44,11 @@ define([
       it("can require an email");
       it("can require a country");
       it("can require a user id (ORCID)");
+
+      it("should require a valid email", function () {
+        state.party.set("email", ["not an email"]);
+        state.party.isValid().should.be.false;
+      });
     });
   });
 });