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