CSSJanus: Account for attribute selectors in brace lookahead
authorRoan Kattouw <roan.kattouw@gmail.com>
Mon, 6 Jan 2014 06:51:54 +0000 (14:51 +0800)
committerKrinkle <krinklemail@gmail.com>
Sat, 8 Feb 2014 00:43:52 +0000 (00:43 +0000)
Recognize selectors of the forms [attr=val], [attr*=val], [attr~=val]
and [attr^=val], optionally with single-quoted values.

Because these selectors previously weren't recognized, trying to
apply /* @noflip */ to one of them would be recognized as a
single-property noflip rather than a rule-wide noflip, and so only
the first property in the rule would be noflipped.

The (simplified) input that triggered this bug was:

/* @noflip */ figure[typeof*='mw:Image'].mw-halign-left { clear: left; float: left; }

which became { clear: left; float: right; } when run through CSSJanus.

See also I4cddce80397d8 which is a workaround for this issue

Bug: 50910
Change-Id: If424a1df26bb7a5a18cee4b0318b029392528fc0

includes/libs/CSSJanus.php
tests/phpunit/includes/libs/CSSJanusTest.php

index 5a52fc7..0063a9b 100644 (file)
@@ -102,7 +102,7 @@ class CSSJanus {
                $patterns['possibly_negative_quantity'] = "((?:-?{$patterns['quantity']})|(?:inherit|auto))";
                $patterns['color'] = "(#?{$patterns['nmchar']}+|(?:rgba?|hsla?)\([ \d.,%-]+\))";
                $patterns['url_chars'] = "(?:{$patterns['url_special_chars']}|{$patterns['nonAscii']}|{$patterns['escape']})*";
-               $patterns['lookahead_not_open_brace'] = "(?!({$patterns['nmchar']}|\r?\n|\s|#|\:|\.|\,|\+|>|\(|\))*?{)";
+               $patterns['lookahead_not_open_brace'] = "(?!({$patterns['nmchar']}|\r?\n|\s|#|\:|\.|\,|\+|>|\(|\)|\[|\]|=|\*=|~=|\^=|'[^']*'])*?{)";
                $patterns['lookahead_not_closing_paren'] = "(?!{$patterns['url_chars']}?{$patterns['valid_after_uri_chars']}\))";
                $patterns['lookahead_for_closing_paren'] = "(?={$patterns['url_chars']}?{$patterns['valid_after_uri_chars']}\))";
                $patterns['noflip_single'] = "/({$patterns['noflip_annotation']}{$patterns['lookahead_not_open_brace']}[^;}]+;?)/i";
index 5a3c161..c8b20d2 100644 (file)
@@ -31,8 +31,10 @@ class CSSJanusTest extends MediaWikiTestCase {
         * @dataProvider provideTransformAdvancedCases
         */
        public function testTransformAdvanced( $code, $expectedOutput, $options = array() ) {
-               $swapLtrRtlInURL = isset( $options['swapLtrRtlInURL'] ) ? $options['swapLtrRtlInURL'] : false;
-               $swapLeftRightInURL = isset( $options['swapLeftRightInURL'] ) ? $options['swapLeftRightInURL'] : false;
+               $swapLtrRtlInURL = isset( $options['swapLtrRtlInURL'] ) ?
+                       $options['swapLtrRtlInURL'] : false;
+               $swapLeftRightInURL = isset( $options['swapLeftRightInURL'] ) ?
+                       $options['swapLeftRightInURL'] : false;
 
                $flipped = CSSJanus::transform( $code, $swapLtrRtlInURL, $swapLeftRightInURL );
 
@@ -437,6 +439,26 @@ class CSSJanusTest extends MediaWikiTestCase {
                                'div { float: left; /* @noflip */ text-align: left; }',
                                'div { float: right; /* @noflip */ text-align: left; }'
                        ),
+                       array(
+                               // before a *= attribute selector with multiple properties
+                               '/* @noflip */ div.foo[bar*=baz] { float:left; clear: left; }'
+                       ),
+                       array(
+                               // before a ^= attribute selector with multiple properties
+                               '/* @noflip */ div.foo[bar^=baz] { float:left; clear: left; }'
+                       ),
+                       array(
+                               // before a ~= attribute selector with multiple properties
+                               '/* @noflip */ div.foo[bar~=baz] { float:left; clear: left; }'
+                       ),
+                       array(
+                               // before a = attribute selector with multiple properties
+                               '/* @noflip */ div.foo[bar=baz] { float:left; clear: left; }'
+                       ),
+                       array(
+                               // before a quoted attribute selector with multiple properties
+                               '/* @noflip */ div.foo[bar=\'baz{quux\'] { float:left; clear: left; }'
+                       ),
 
                        // Guard against css3 stuff
                        array(