diff --git a/FormWidget.js b/FormWidget.js
index ed531ebfb3..d5f142c7e3 100644
--- a/FormWidget.js
+++ b/FormWidget.js
@@ -98,6 +98,28 @@ define([
 		 * @default undefined
 		 */
 
+		_mapAttributes: dcl.superCall(function (sup) {
+			return function () {
+				var input = this.querySelector("input");
+				if (input) {
+					// Get value and name from embedded <input> node.
+					if (input.value) {
+						this.setAttribute("value", input.value);
+					}
+					if (input.name) {
+						this.setAttribute("name", input.name);
+					}
+				} else {
+					// Create this.valueNode as a convenience, but don't add to the DOM because that breaks widgets like
+					// deliteful/Checkbox that unconditionally create their own this.valueNode:
+					// You end up with two embedded <input> nodes.
+					input = this.ownerDocument.createElement("input");
+				}
+				this.valueNode = input;
+				return sup.call(this);
+			};
+		}),
+
 		refreshRendering: function (oldValues) {
 			// Handle disabled and tabIndex, across the tabStops and root node.
 			// No special processing is needed for tabStops other than just to refresh disabled and tabIndex.
diff --git a/tests/functional/FormValueWidget.html b/tests/functional/FormValueWidget.html
index 8e6db6997f..54a6ec9107 100644
--- a/tests/functional/FormValueWidget.html
+++ b/tests/functional/FormValueWidget.html
@@ -42,19 +42,9 @@
 					"<span attach-point=focusNode class='value'>{{this.value}}</span>" +
 					"<span on-click=decrement class='button decrement'>-</span>" +
 					"<span on-click=increment class='button increment'>+</span>" +
-					"<span style='display:none' attach-point=containerNode></span>" +
+					"<span style='display:none' attach-point=containerNode></span>" +	// for this.valueNode <input>
 					"</template>"
 				),
-				postRender: function () {
-					// TODO: move this logic into FormValueWidget itself?
-					this.valueNode = this.containerNode.querySelector("input");
-					if (this.valueNode) {
-						this.value = this.valueNode.value;
-					} else {
-						this.valueNode = this.ownerDocument.createElement("input");
-						this.containerNode.appendChild(this.valueNode);
-					}
-				},
 				decrement: function () {
 					this.value--;
 				},
@@ -72,7 +62,7 @@ <h1>FormValueWidget functional test</h1>
 
 <form id="form1">
 	<span id="spinner1_label">Spinner widget based on FormValueWidget:</span>
-	<my-spinner id="spinner1" aria-labelledby="spinner1_label"><input value="5"></my-spinner>
+	<my-spinner id="spinner1" aria-labelledby="spinner1_label"><input value="5" name="spinner1_name"></my-spinner>
 
 	<br>
 	<input type="reset" id="resetB" name="reset">
diff --git a/tests/functional/FormValueWidget.js b/tests/functional/FormValueWidget.js
index debf61edf4..b8824e56dd 100644
--- a/tests/functional/FormValueWidget.js
+++ b/tests/functional/FormValueWidget.js
@@ -17,6 +17,15 @@ define([
 					intern.config.WAIT_TIMEOUT, intern.config.POLL_INTERVAL));
 		},
 
+		creation: function () {
+			this.timeout = intern.config.TEST_TIMEOUT;
+			return this.remote.execute("return spinner1.value").then(function (value) {
+				assert.equal(value, 5, "original value");	// taken from the embedded <input>
+			}).execute("return spinner1.name").then(function (name) {
+				assert.strictEqual(name, "spinner1_name", "name");
+			});
+		},
+
 		reset: function () {
 			this.timeout = intern.config.TEST_TIMEOUT;
 			var environmentType = this.remote.environmentType;