fix: support value !important;

thysultan · Apr 21, 2022 · 82fccf7 · 82fccf7
1 parent c3c05cd
commit 82fccf7
Show file tree

Hide file tree

Showing 2 changed files with 7 additions and 2 deletions.
diff --git a/src/Prefixer.js b/src/Prefixer.js
@@ -110,13 +110,13 @@ export function prefix (value, length, children) {
 				break
 		// display: (flex|inline-flex|grid|inline-grid)
 		case 6444:
-			switch (charat(value, strlen(value) - 3 - (~indexof(value, '!important') && 10))) {
+			switch (charat(value, strlen(value) - 3 - (~indexof(value, ' !important') ? 11 : ~indexof(value, '!important') && 10))) {
 				// stic(k)y
 				case 107:
 					return replace(value, ':', ':' + WEBKIT) + value
 				// (inline-)?fl(e)x
 				case 101:
-					return replace(value, /(.+:)([^;!]+)(;|!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value
+					return replace(value, /(.+:)([^;\s!]+)(;|\s?!.+)?/, '$1' + WEBKIT + (charat(value, 14) === 45 ? 'inline-' : '') + 'box$3' + '$1' + WEBKIT + '$2$3' + '$1' + MS + '$2box$3') + value
 				// (inline-)?grid
 				case 105:
 					return replace(value, ':', ':' + MS) + value

diff --git a/test/Prefixer.js b/test/Prefixer.js
@@ -4,6 +4,7 @@ describe('Prefixer', () => {
 	test('flex-box', () => {
 		expect(prefix(`display:block;`, 7)).to.equal(['display:block;'].join())
 		expect(prefix(`display:flex!important;`, 7)).to.equal([`display:-webkit-box!important;`, `display:-webkit-flex!important;`, `display:-ms-flexbox!important;`, `display:flex!important;`].join(''))
+		expect(prefix(`display:flex !important;`, 7)).to.equal([`display:-webkit-box !important;`, `display:-webkit-flex !important;`, `display:-ms-flexbox !important;`, `display:flex !important;`].join(''))
 		expect(prefix(`display:inline-flex;`, 7)).to.equal([`display:-webkit-inline-box;`, `display:-webkit-inline-flex;`, `display:-ms-inline-flexbox;`, `display:inline-flex;`].join(''))
 		expect(prefix(`flex:inherit;`, 4)).to.equal([`-webkit-flex:inherit;`, `-ms-flex:inherit;`, `flex:inherit;`].join(''))
 		expect(prefix(`flex-grow:none;`, 9)).to.equal([`-webkit-box-flex:none;`, `-webkit-flex-grow:none;`, `-ms-flex-positive:none;`, `flex-grow:none;`].join(''))
@@ -105,6 +106,8 @@ describe('Prefixer', () => {
 	test('position', () => {
 		expect(prefix(`position:relative;`, 8)).to.equal([`position:relative;`].join(''))
 		expect(prefix(`position:sticky;`, 8)).to.equal([`position:-webkit-sticky;`, `position:sticky;`].join(''))
+		expect(prefix(`position:sticky!important;`, 8)).to.equal([`position:-webkit-sticky!important;`, `position:sticky!important;`].join(''))
+		expect(prefix(`position:sticky !important;`, 8)).to.equal([`position:-webkit-sticky !important;`, `position:sticky !important;`].join(''))
 	})
 
 	test('color-adjust', () => {
@@ -191,6 +194,8 @@ describe('Prefixer', () => {
 	test('grid', () => {
 		expect(prefix('display:grid;', 7)).to.equal([`display:-ms-grid;`, `display:grid;`].join(''))
 		expect(prefix('display:inline-grid;', 7)).to.equal([`display:-ms-inline-grid;`, `display:inline-grid;`].join(''))
+		expect(prefix('display:inline-grid!important;', 7)).to.equal([`display:-ms-inline-grid!important;`, `display:inline-grid!important;`].join(''))
+		expect(prefix('display:inline-grid !important;', 7)).to.equal([`display:-ms-inline-grid !important;`, `display:inline-grid !important;`].join(''))
 		expect(prefix(`align-self:value;`, 10)).to.equal([`-webkit-align-self:value;`, `-ms-flex-item-align:value;`, `-ms-grid-row-align:value;`, `align-self:value;`].join(''))
 		expect(prefix(`align-self:safe center;`, 10)).to.equal([`-webkit-align-self:safe center;`, `-ms-flex-item-align:safe center;`, `-ms-grid-row-align:safe center;`, `align-self:safe center;`].join(''))
 		expect(prefix('align-self:stretch;', 10)).to.equal([`-webkit-align-self:stretch;`, `-ms-flex-item-align:stretch;`, `-ms-grid-row-align:stretch;`, `align-self:stretch;`].join(''))