CSS: Trim whitespace surrounding CSS Custom Properties values

The spec has recently changed and CSS Custom Properties values are trimmed now.
This change makes jQuery polyfill that new behavior for all browsers.

Ref w3c/csswg-drafts#774
Fixes gh-4926
Closes gh-4930

(partially cherry picked from commit efadfe991a5c287af561a9326bf1427d726c91c1)

1 files changed, 28 insertions, 25 deletions

diff --git a/test/unit/css.js b/test/unit/css.js
index 81401d158..84f8c381c 100644
--- a/test/unit/css.js
+++ b/test/unit/css.js
@@ -1745,9 +1745,16 @@ QUnit.test( "Do not throw on frame elements from css method (#15098)", function(
 			"    .test__customProperties {\n" +
 			"        --prop1:val1;\n" +
 			"        --prop2: val2;\n" +
-			"        --prop3:val3 ;\n" +
-			"        --prop4:\"val4\";\n" +
-			"        --prop5:'val5';\n" +
+			"        --prop3:   val3;\n" +
+			"        --prop4:val4 ;\n" +
+			"        --prop5:val5   ;\n" +
+			"        --prop6: val6 ;\n" +
+			"        --prop7:   val7   ;\n" +
+			"        --prop8:\"val8\";\n" +
+			"        --prop9:'val9';\n" +
+			"        --prop10:\f\r\n\t val10 \f\r\n\t;\n" +
+			"        --prop11:\u000C\u000D\u000A\u0009\u0020val11\u0020\u0009\u000A\u000D\u000C;\n" +
+			"        --prop12:\u000Bval12\u000B;\n" +
 			"    }\n" +
 			"</style>"
 		);
@@ -1755,18 +1762,10 @@ QUnit.test( "Do not throw on frame elements from css method (#15098)", function(
 		var div = jQuery( "<div>" ).appendTo( "#qunit-fixture" ),
 			$elem = jQuery( "<div>" ).addClass( "test__customProperties" )
 				.appendTo( "#qunit-fixture" ),
-			webkit = /\bsafari\b/i.test( navigator.userAgent ) &&
-				!/\firefox\b/i.test( navigator.userAgent ) &&
-				!/\edge\b/i.test( navigator.userAgent ),
-			oldSafari = webkit && ( /\b9\.\d(\.\d+)* safari/i.test( navigator.userAgent ) ||
-				/\b10\.0(\.\d+)* safari/i.test( navigator.userAgent ) ||
-				/iphone os (?:9|10)_/i.test( navigator.userAgent ) ),
-			expected = 10;
-
-		if ( webkit ) {
-			expected -= 2;
-		}
-		if ( oldSafari ) {
+			webkitOrBlink = /\bsafari\b/i.test( navigator.userAgent ),
+			expected = 17;
+
+		if ( webkitOrBlink ) {
 			expected -= 2;
 		}
 		assert.expect( expected );
@@ -1792,20 +1791,24 @@ QUnit.test( "Do not throw on frame elements from css method (#15098)", function(
 
 		assert.equal( $elem.css( "--prop1" ), "val1", "Basic CSS custom property" );
 
-		// Support: Safari 9.1-10.0 only
-		// Safari collapses whitespaces & quotes. Ignore it.
-		if ( !oldSafari ) {
-			assert.equal( $elem.css( "--prop2" ), " val2", "Preceding whitespace maintained" );
-			assert.equal( $elem.css( "--prop3" ), "val3 ", "Following whitespace maintained" );
-		}
+		assert.equal( $elem.css( "--prop2" ), "val2", "Preceding whitespace trimmed" );
+		assert.equal( $elem.css( "--prop3" ), "val3", "Multiple preceding whitespace trimmed" );
+		assert.equal( $elem.css( "--prop4" ), "val4", "Following whitespace trimmed" );
+		assert.equal( $elem.css( "--prop5" ), "val5", "Multiple Following whitespace trimmed" );
+		assert.equal( $elem.css( "--prop6" ), "val6", "Preceding and Following whitespace trimmed" );
+		assert.equal( $elem.css( "--prop7" ), "val7", "Multiple preceding and following whitespace trimmed" );
 
-		// Support: Chrome 49-55, Safari 9.1-10.0
+		// Support: Chrome <=49 - 73+, Safari <=9.1 - 12.1+
 		// Chrome treats single quotes as double ones.
 		// Safari treats double quotes as single ones.
-		if ( !webkit ) {
-			assert.equal( $elem.css( "--prop4" ), "\"val4\"", "Works with double quotes" );
-			assert.equal( $elem.css( "--prop5" ), "'val5'", "Works with single quotes" );
+		if ( !webkitOrBlink ) {
+			assert.equal( $elem.css( "--prop8" ), "\"val8\"", "Works with double quotes" );
+			assert.equal( $elem.css( "--prop9" ), "'val9'", "Works with single quotes" );
 		}
+
+		assert.equal( $elem.css( "--prop10" ), "val10", "Multiple preceding and following escaped unicode whitespace trimmed" );
+		assert.equal( $elem.css( "--prop11" ), "val11", "Multiple preceding and following unicode whitespace trimmed" );
+		assert.equal( $elem.css( "--prop12" ), "\u000Bval12\u000B", "Multiple preceding and following non-CSS whitespace reserved" );
 	} );
 
 	QUnit[ supportsCssVars ? "test" : "skip" ]( "Don't append px to CSS vars", function( assert ) {