Merge 5af633d into 2ad0a31

unexpectedjs · Jan 8, 2019 · 07d1133 · 07d1133
2 parents 2ad0a31 + 5af633d
commit 07d1133
Show file tree

Hide file tree

Showing 2 changed files with 41 additions and 1 deletion.
diff --git a/src/index.js b/src/index.js
@@ -85,7 +85,12 @@ function isEnumeratedAttribute(attrName) {
 function validateStyles(expect, str) {
   const invalidStyles = str
     .split(';')
-    .filter(part => !/^\s*(\w|-)+\s*:\s*(\w|-)+\s*$|^$/.test(part));
+    .filter(
+      part =>
+        !/^\s*(\w|-)+\s*:\s*(#(?:[0-9a-fA-F]{3}){1,2}|(\w|-)+)\s*$|^$/.test(
+          part
+        )
+    );
 
   if (invalidStyles.length > 0) {
     expect.errorMode = 'nested';

diff --git a/test/index.spec.js b/test/index.spec.js
@@ -1820,6 +1820,41 @@ describe('unexpected-dom', () => {
           parseHtml('<div style="">hey</div>')
         ));
 
+      it('should not fail for a style attribute with hex value (short) on the RHS', () => {
+        expect(
+          parseHtml('<div style="border-left-color: #000">hey</div>'),
+          'to satisfy',
+          parseHtml('<div style="border-left-color: #000;">hey</div>')
+        );
+      });
+
+      it('should not fail for a style attribute with hex value (long) on the RHS', () => {
+        expect(
+          parseHtml('<div style="border-left-color: #1BcD3F">hey</div>'),
+          'to satisfy',
+          parseHtml('<div style="border-left-color: #1BcD3F;">hey</div>')
+        );
+      });
+
+      it('should fail when the RHS has invalid styles', () =>
+        expect(
+          () =>
+            expect(
+              parseHtml('<div style="border-left-color: #FFF">hey</div>'),
+              'to satisfy',
+              parseHtml('<div style="border-left-color: #FFFF;">hey</div>')
+            ),
+          'to error',
+          'expected <div style="border-left-color: #FFF">hey</div>\n' +
+            'to satisfy <div style="border-left-color: #FFFF">hey</div>\n' +
+            '\n' +
+            '<div\n' +
+            '  style="border-left-color: #FFF" // expected <div style="border-left-color: #FFF">hey</div>\n' +
+            "                                  // to satisfy { name: 'div', attributes: { style: 'border-left-color: #FFFF;' }, children: [ 'hey' ] }\n" +
+            "                                  //   Expectation contains invalid styles: 'border-left-color: #FFFF'\n" +
+            '>hey</div>'
+        ));
+
       it('should fail when the RHS has invalid styles', () =>
         expect(
           () =>