From edf83471b9aaa11c95c86c13f87d1086927bde98 Mon Sep 17 00:00:00 2001 From: Richard Feldman Date: Fri, 22 Jul 2016 09:55:34 -0700 Subject: [PATCH 1/5] Add a failing test for https://github.com/rtfeldman/elm-css/issues/140 --- test/Fixtures.elm | 11 +++++++++++ test/Tests.elm | 23 +++++++++++++++++++++++ 2 files changed, 34 insertions(+) diff --git a/test/Fixtures.elm b/test/Fixtures.elm index 9be1111b..db0f64f2 100644 --- a/test/Fixtures.elm +++ b/test/Fixtures.elm @@ -69,6 +69,17 @@ bug99 = ] +bug140 : Stylesheet +bug140 = + stylesheet + [ each [ input, selector "textarea" ] + [ focus + [ borderColor (hex "#000000") + ] + ] + ] + + simpleEach : Stylesheet simpleEach = stylesheet diff --git a/test/Tests.elm b/test/Tests.elm index b53e1205..07a56a1e 100644 --- a/test/Tests.elm +++ b/test/Tests.elm @@ -22,6 +22,7 @@ all = , atRule , nestedAtRule , bug99 + , bug140 , universal , multiSelector , multiDescendent @@ -210,6 +211,28 @@ nestedAtRule = ] +{-| Regression test for https://github.com/rtfeldman/elm-css/issues/140 +-} +bug140 : Test +bug140 = + let + input = + Fixtures.bug140 + + output = + """ +input:focus, textarea:focus { + border-color: #000000; +} """ + in + describe "`each` with pseudo classes" + [ test "pretty prints the expected output" <| + \_ -> + outdented (prettyPrint input) + |> Expect.equal (outdented output) + ] + + {-| Regression test for https://github.com/rtfeldman/elm-css/issues/99 -} bug99 : Test From c779b1feda42b35aa6adb3d31728b63282ab76d0 Mon Sep 17 00:00:00 2001 From: Tolga Paksoy Date: Sun, 24 Jul 2016 17:17:34 +0200 Subject: [PATCH 2/5] Fix pseudo classes not applying on chained selectors with `each` --- src/Css/Structure.elm | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/Css/Structure.elm b/src/Css/Structure.elm index 0fc57a72..12e43888 100644 --- a/src/Css/Structure.elm +++ b/src/Css/Structure.elm @@ -257,9 +257,12 @@ appendToLastSelector selector styleBlock = let newRest = mapLast (appendRepeatableSelector selector) rest + + newFirst = + appendRepeatableSelector selector first in [ StyleBlock first rest properties - , StyleBlock first newRest [] + , StyleBlock newFirst newRest [] ] From 039b6d1757d393cab719de294454a26a89423e3b Mon Sep 17 00:00:00 2001 From: Tolga Paksoy Date: Sun, 24 Jul 2016 17:19:18 +0200 Subject: [PATCH 3/5] Fix pseudo classes only applying to last selector --- src/Css/Structure.elm | 2 +- test/Fixtures.elm | 2 +- test/Tests.elm | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/src/Css/Structure.elm b/src/Css/Structure.elm index 12e43888..579871e2 100644 --- a/src/Css/Structure.elm +++ b/src/Css/Structure.elm @@ -256,7 +256,7 @@ appendToLastSelector selector styleBlock = StyleBlock first rest properties -> let newRest = - mapLast (appendRepeatableSelector selector) rest + List.map (appendRepeatableSelector selector) rest newFirst = appendRepeatableSelector selector first diff --git a/test/Fixtures.elm b/test/Fixtures.elm index db0f64f2..9317079a 100644 --- a/test/Fixtures.elm +++ b/test/Fixtures.elm @@ -72,7 +72,7 @@ bug99 = bug140 : Stylesheet bug140 = stylesheet - [ each [ input, selector "textarea" ] + [ each [ input, select, selector "textarea"] [ focus [ borderColor (hex "#000000") ] diff --git a/test/Tests.elm b/test/Tests.elm index 07a56a1e..8e83e9b9 100644 --- a/test/Tests.elm +++ b/test/Tests.elm @@ -221,7 +221,7 @@ bug140 = output = """ -input:focus, textarea:focus { +input:focus, select:focus, textarea:focus { border-color: #000000; } """ in From f216afd2940561de2b12f8a804b08ceb554f2c8a Mon Sep 17 00:00:00 2001 From: Tolga Paksoy Date: Sun, 24 Jul 2016 17:42:46 +0200 Subject: [PATCH 4/5] Fix pseudo elements not working with `each` --- src/Css/Structure.elm | 13 +++++++++++-- test/Fixtures.elm | 3 +++ test/Tests.elm | 7 ++++++- 3 files changed, 20 insertions(+), 3 deletions(-) diff --git a/src/Css/Structure.elm b/src/Css/Structure.elm index 579871e2..3bc22305 100644 --- a/src/Css/Structure.elm +++ b/src/Css/Structure.elm @@ -274,8 +274,17 @@ appendPseudoElementToLastSelector pseudo styleBlock = , StyleBlock (applyPseudoElement pseudo only) [] [] ] - a -> - [ a ] + StyleBlock first rest properties -> + let + newRest = + List.map (applyPseudoElement pseudo) rest + + newFirst = + applyPseudoElement pseudo first + in + [ StyleBlock first rest properties + , StyleBlock newFirst newRest [] + ] applyPseudoElement : PseudoElement -> Selector -> Selector diff --git a/test/Fixtures.elm b/test/Fixtures.elm index 9317079a..b26b309d 100644 --- a/test/Fixtures.elm +++ b/test/Fixtures.elm @@ -76,6 +76,9 @@ bug140 = [ focus [ borderColor (hex "#000000") ] + , after + [ color (hex "#aaaaaa") + ] ] ] diff --git a/test/Tests.elm b/test/Tests.elm index 8e83e9b9..f249e2d8 100644 --- a/test/Tests.elm +++ b/test/Tests.elm @@ -223,7 +223,12 @@ bug140 = """ input:focus, select:focus, textarea:focus { border-color: #000000; -} """ +} + +input::after, select::after, textarea::after { + color: #aaaaaa; +} + """ in describe "`each` with pseudo classes" [ test "pretty prints the expected output" <| From 58e7d8a0a14ff3f3dc39f8ad400934017edc793b Mon Sep 17 00:00:00 2001 From: Tolga Paksoy Date: Sun, 24 Jul 2016 18:02:36 +0200 Subject: [PATCH 5/5] Refactor pseudo elements and pseudo classes duplication --- src/Css/Preprocess/Resolve.elm | 2 +- src/Css/Structure.elm | 33 +++++++++++---------------------- 2 files changed, 12 insertions(+), 23 deletions(-) diff --git a/src/Css/Preprocess/Resolve.elm b/src/Css/Preprocess/Resolve.elm index 4985c18c..873db9e8 100644 --- a/src/Css/Preprocess/Resolve.elm +++ b/src/Css/Preprocess/Resolve.elm @@ -279,7 +279,7 @@ applyMixins mixins declarations = applyNestedMixinsToLast nestedMixins rest - (Structure.appendToLastSelector selector) + (Structure.appendRepeatableToLastSelector selector) declarations (NestSnippet selectorCombinator snippets) :: rest -> diff --git a/src/Css/Structure.elm b/src/Css/Structure.elm index 3bc22305..ced7205f 100644 --- a/src/Css/Structure.elm +++ b/src/Css/Structure.elm @@ -245,46 +245,35 @@ extendLastSelector selector declarations = first :: extendLastSelector selector rest -appendToLastSelector : RepeatableSimpleSelector -> StyleBlock -> List StyleBlock -appendToLastSelector selector styleBlock = +appendToLastSelector : (Selector -> Selector) -> StyleBlock -> List StyleBlock +appendToLastSelector f styleBlock = case styleBlock of StyleBlock only [] properties -> [ StyleBlock only [] properties - , StyleBlock (appendRepeatableSelector selector only) [] [] + , StyleBlock (f only) [] [] ] StyleBlock first rest properties -> let newRest = - List.map (appendRepeatableSelector selector) rest + List.map f rest newFirst = - appendRepeatableSelector selector first + f first in [ StyleBlock first rest properties , StyleBlock newFirst newRest [] ] -appendPseudoElementToLastSelector : PseudoElement -> StyleBlock -> List StyleBlock -appendPseudoElementToLastSelector pseudo styleBlock = - case styleBlock of - StyleBlock only [] properties -> - [ StyleBlock only [] properties - , StyleBlock (applyPseudoElement pseudo only) [] [] - ] +appendRepeatableToLastSelector : RepeatableSimpleSelector -> StyleBlock -> List StyleBlock +appendRepeatableToLastSelector selector styleBlock = + appendToLastSelector (appendRepeatableSelector selector) styleBlock - StyleBlock first rest properties -> - let - newRest = - List.map (applyPseudoElement pseudo) rest - newFirst = - applyPseudoElement pseudo first - in - [ StyleBlock first rest properties - , StyleBlock newFirst newRest [] - ] +appendPseudoElementToLastSelector : PseudoElement -> StyleBlock -> List StyleBlock +appendPseudoElementToLastSelector pseudo styleBlock = + appendToLastSelector (applyPseudoElement pseudo) styleBlock applyPseudoElement : PseudoElement -> Selector -> Selector