diff --git a/src/Test/Html/Internal/ElmHtml/Query.elm b/src/Test/Html/Internal/ElmHtml/Query.elm
index 9f5e4960..e6b5ea4d 100644
--- a/src/Test/Html/Internal/ElmHtml/Query.elm
+++ b/src/Test/Html/Internal/ElmHtml/Query.elm
@@ -29,9 +29,7 @@ import Test.Html.Internal.ElmHtml.InternalTypes exposing (..)
type Selector
= Id String
| ClassName String
- | ClassNameNS String
| ClassList (List String)
- | ClassListNS (List String)
| Tag String
| Attribute String String
| BoolAttribute String Bool
@@ -241,22 +239,12 @@ hasBoolAttribute attribute value facts =
hasClass : String -> Facts msg -> Bool
hasClass queryString facts =
- List.member queryString (classnames facts)
-
-
-hasClassNS : String -> Facts msg -> Bool
-hasClassNS queryString facts =
- List.member queryString (classnamesNS facts)
+ List.member queryString (classnames facts ++ classes facts)
hasClasses : List String -> Facts msg -> Bool
hasClasses classList facts =
- containsAll classList (classnames facts)
-
-
-hasClassesNS : List String -> Facts msg -> Bool
-hasClassesNS classList facts =
- containsAll classList (classnamesNS facts)
+ containsAll classList (classnames facts ++ classes facts)
hasStyle : { key : String, value : String } -> Facts msg -> Bool
@@ -271,8 +259,8 @@ classnames facts =
|> String.split " "
-classnamesNS : Facts msg -> List String
-classnamesNS facts =
+classes : Facts msg -> List String
+classes facts =
Dict.get "class" facts.stringAttributes
|> Maybe.withDefault ""
|> String.split " "
@@ -296,18 +284,10 @@ nodeRecordPredicate selector =
.facts
>> hasClass classname
- ClassNameNS classname ->
- .facts
- >> hasClassNS classname
-
ClassList classList ->
.facts
>> hasClasses classList
- ClassListNS classList ->
- .facts
- >> hasClassesNS classList
-
Tag tag ->
.tag
>> (==) tag
@@ -343,18 +323,10 @@ markdownPredicate selector =
.facts
>> hasClass classname
- ClassNameNS classname ->
- .facts
- >> hasClassNS classname
-
ClassList classList ->
.facts
>> hasClasses classList
- ClassListNS classList ->
- .facts
- >> hasClassesNS classList
-
Tag tag ->
always False
diff --git a/src/Test/Html/Selector.elm b/src/Test/Html/Selector.elm
index e2545725..27244c2d 100644
--- a/src/Test/Html/Selector.elm
+++ b/src/Test/Html/Selector.elm
@@ -1,7 +1,7 @@
module Test.Html.Selector exposing
( Selector
, tag, text, containing, attribute, all
- , id, class, classNS, classes, classesNS, exactClassName, exactClassNameNS, style, checked, selected, disabled
+ , id, class, classes, exactClassName, style, checked, selected, disabled
)
{-| Selecting HTML elements.
@@ -16,7 +16,7 @@ module Test.Html.Selector exposing
## Attributes
-@docs id, class, classNS, classes, classesNS, exactClassName, exactClassNameNS, style, checked, selected, disabled
+@docs id, class, classes, exactClassName, style, checked, selected, disabled
-}
@@ -85,32 +85,6 @@ classes =
Classes
-{-| Matches svg elements that have all the given classes (and possibly others as well).
-
-When you only care about one class instead of several, you can use
-[`classNS`](#classNS) instead of passing this function a list with one value in it.
-
-To match the element's exact class attribute string, use [`exactClassNameNS`](#exactClassNameNS).
-
- import Svg.Html as SvgHtml
- import Svg.Attributes as SvgAttr
- import Test.Html.Query as Query
- import Test exposing (test)
- import Test.Html.Selector exposing (classesNS)
-
-
- test "Svg has the classes svg-styles and svg-large" <|
- \() ->
- SvgHtml.svg [ SvgAttr.class "svg-styles svg-large" ] []
- |> Query.fromHtml
- |> Query.has [ classesNS [ "svg-styles", "svg-large" ] ]
-
--}
-classesNS : List String -> Selector
-classesNS =
- ClassesNS
-
-
{-| Matches elements that have the given class (and possibly others as well).
To match multiple classes at once, use [`classes`](#classes) instead.
@@ -136,36 +110,11 @@ class =
Class
-{-| Matches svg elements that have the given class (and possibly others as well).
-
-To match multiple classes at once, use [`classesNS`](#classesNS) instead.
-
-To match the element's exact class attribute string, use [`exactClassNameNS`](#exactClassNameNS).
-
- import Svg.Html as SvgHtml
- import Svg.Attributes as SvgAttr
- import Test.Html.Query as Query
- import Test exposing (test)
- import Test.Html.Selector exposing (classNS)
-
-
- test "Svg has the class svg-large" <|
- \() ->
- SvgHtml.svg [ SvgAttr.class "svg-styles svg-large" ] [ ]
- |> Query.fromHtml
- |> Query.has [ classNS "svg-large" ]
-
--}
-classNS : String -> Selector
-classNS =
- ClassNS
-
-
-{-| Matches the element's exact class attribute string.
+{-| Matches the element's exact "className" property string.
This is used less often than [`class`](#class), [`classes`](#classes) or
[`attribute`](#attribute), which check for the _presence_ of a class as opposed
-to matching the entire class attribute exactly.
+to matching the entire class property exactly.
import Html
import Html.Attributes as Attr
@@ -180,37 +129,14 @@ to matching the entire class attribute exactly.
|> Query.fromHtml
|> Query.has [ exactClassName "btn btn-large" ]
+There's a difference between properties and attributes (read more [here](https://github.com/elm/html/blob/master/properties-vs-attributes.md)).
+
-}
exactClassName : String -> Selector
exactClassName =
namedAttr "className"
-{-| Matches the svg element's exact class attribute string.
-
-This is used less often than [`classNS`](#classNS) or [`classesNS`](#classesNS),
-which check for the _presence_ of a class as opposed to matching the entire
-class attribute exactly.
-
- import Svg.Html as SvgHtml
- import Svg.Attributes as SvgAttr
- import Test.Html.Query as Query
- import Test exposing (test)
- import Test.Html.Selector exposing (exactClassNameNS)
-
-
- test "Svg has the exact class 'svg-styles svg-large'" <|
- \() ->
- SvgHtml.svg [ SvgAttr.class "btn btn-large" ] []
- |> Query.fromHtml
- |> Query.has [ exactClassNameNS "svg-styles svg-large" ]
-
--}
-exactClassNameNS : String -> Selector
-exactClassNameNS =
- namedAttr "class"
-
-
{-| Matches elements that have the given `id` attribute.
import Html
diff --git a/src/Test/Html/Selector/Internal.elm b/src/Test/Html/Selector/Internal.elm
index b4cee281..abe9a4e1 100644
--- a/src/Test/Html/Selector/Internal.elm
+++ b/src/Test/Html/Selector/Internal.elm
@@ -7,9 +7,7 @@ import Test.Html.Internal.ElmHtml.Query as ElmHtmlQuery
type Selector
= All (List Selector)
| Classes (List String)
- | ClassesNS (List String)
| Class String
- | ClassNS String
| Attribute { name : String, value : String }
| BoolAttribute { name : String, value : Bool }
| Style { key : String, value : String }
@@ -42,15 +40,9 @@ selectorToString criteria =
Classes list ->
"classes " ++ quoteString (String.join " " list)
- ClassesNS list ->
- "classesNS " ++ quoteString (String.join " " list)
-
Class class ->
"class " ++ quoteString class
- ClassNS class ->
- "classNS " ++ quoteString class
-
Attribute { name, value } ->
"attribute "
++ quoteString name
@@ -145,15 +137,9 @@ query fn fnAll selector list =
Classes classes ->
List.concatMap (fn (ElmHtmlQuery.ClassList classes)) elems
- ClassesNS classes ->
- List.concatMap (fn (ElmHtmlQuery.ClassListNS classes)) elems
-
Class class ->
List.concatMap (fn (ElmHtmlQuery.ClassList [ class ])) elems
- ClassNS class ->
- List.concatMap (fn (ElmHtmlQuery.ClassListNS [ class ])) elems
-
Attribute { name, value } ->
List.concatMap (fn (ElmHtmlQuery.Attribute name value)) elems
diff --git a/tests/src/Test/Html/SelectorTests.elm b/tests/src/Test/Html/SelectorTests.elm
index 374d04e8..992e6f26 100644
--- a/tests/src/Test/Html/SelectorTests.elm
+++ b/tests/src/Test/Html/SelectorTests.elm
@@ -6,11 +6,12 @@ module Test.Html.SelectorTests exposing (all)
import Fuzz exposing (..)
import Html
import Html.Attributes as Attr
+import Json.Encode
import Svg
import Svg.Attributes as SvgAttribs
import Test exposing (..)
import Test.Html.Query as Query
-import Test.Html.Selector exposing (..)
+import Test.Html.Selector as Selector exposing (..)
all : Test
@@ -19,106 +20,53 @@ all =
[ bug13
, textSelectors
, classSelectors
- , attributeSelectors
- , nsSelectors
- ]
-
-
-nsSelectors : Test
-nsSelectors =
- describe "NS selectors"
- [ test "classNS selector finds class on svg with one class" <|
- \() ->
- let
- svgClass =
- "some-NS-class"
- in
- Svg.svg
- [ SvgAttribs.class svgClass ]
- [ Svg.circle [ SvgAttribs.cx "50", SvgAttribs.cy "50", SvgAttribs.r "40" ] [] ]
- |> Query.fromHtml
- |> Query.has [ classNS svgClass ]
- , test "classNS selector finds class on svg with multiple classes" <|
- \() ->
- let
- svgClass =
- "some-NS-class"
- in
- Svg.svg
- [ SvgAttribs.class svgClass, SvgAttribs.class "another-NS-class" ]
- [ Svg.circle [ SvgAttribs.cx "50", SvgAttribs.cy "50", SvgAttribs.r "40" ] [] ]
- |> Query.fromHtml
- |> Query.has [ classNS svgClass ]
- , test "classesNS selector finds all classes on svg" <|
- \() ->
- let
- svgClass =
- "some-NS-class"
- in
- Svg.svg
- [ SvgAttribs.class svgClass, SvgAttribs.class "another-NS-class" ]
- [ Svg.circle [ SvgAttribs.cx "50", SvgAttribs.cy "50", SvgAttribs.r "40" ] [] ]
- |> Query.fromHtml
- |> Query.has [ classesNS [ svgClass, "another-NS-class" ] ]
- , test "classesNS selector finds single class on svg with multiple classes" <|
- \() ->
- let
- svgClass =
- "some-NS-class"
- in
- Svg.svg
- [ SvgAttribs.class svgClass, SvgAttribs.class "another-NS-class" ]
- [ Svg.circle [ SvgAttribs.cx "50", SvgAttribs.cy "50", SvgAttribs.r "40" ] [] ]
- |> Query.fromHtml
- |> Query.has [ classesNS [ svgClass ] ]
- , test "exactClassNameNS selector finds the exact class value on svg" <|
- \() ->
- let
- svgClass =
- "some-NS-class another-NS-class"
- in
- Svg.svg
- [ SvgAttribs.class svgClass ]
- [ Svg.circle [ SvgAttribs.cx "50", SvgAttribs.cy "50", SvgAttribs.r "40" ] [] ]
- |> Query.fromHtml
- |> Query.has [ exactClassNameNS svgClass ]
- ]
-
-
-attributeSelectors : Test
-attributeSelectors =
- describe "attribute selectors"
- [ test "attribute selector does not find class on svg elements" <|
- \() ->
- let
- svgClass =
- "some-NS-class"
- in
- Svg.svg
- [ SvgAttribs.class svgClass ]
- [ Svg.circle [ SvgAttribs.cx "50", SvgAttribs.cy "50", SvgAttribs.r "40" ] [] ]
- |> Query.fromHtml
- |> Query.hasNot [ attribute (SvgAttribs.class svgClass) ]
]
classSelectors : Test
classSelectors =
- describe "class selectors"
- [ test "does not find class on svg elements" <|
- \() ->
- let
- svgClass =
- "some-NS-class"
- in
+ describe "class attribute assertions"
+ [ describe "Using Html.Attribute.class" <|
+ classAssertions [ "some-custom-class" ] <|
+ Html.div [ Attr.class "some-custom-class" ] []
+ , describe "Using Html.Attribute.property" <|
+ classAssertions [ "some-custom-class" ] <|
+ Html.div [ Attr.property "className" (Json.Encode.string "some-custom-class") ] []
+ , describe "Using Html.Attribute.attribute" <|
+ classAssertions [ "some-custom-class" ] <|
+ Html.div [ Attr.attribute "class" "some-custom-class" ] []
+ , describe "svg with one class" <|
+ classAssertions [ "some-NS-class" ] <|
+ Svg.svg [ SvgAttribs.class "some-NS-class" ] []
+ , describe "with multiple classes" <|
+ classAssertions [ "some-NS-class", "another-NS-class" ] <|
Svg.svg
- [ SvgAttribs.class svgClass ]
- [ Svg.circle [ SvgAttribs.cx "50", SvgAttribs.cy "50", SvgAttribs.r "40" ] [] ]
- |> Query.fromHtml
- |> Query.hasNot [ class svgClass ]
+ [ SvgAttribs.class "some-NS-class"
+ , SvgAttribs.class "another-NS-class"
+ ]
+ []
]
+classAssertions : List String -> Html.Html msg -> List Test
+classAssertions classes html =
+ (test "Test.Html.Selector.classes finds the classes" <|
+ \_ ->
+ html
+ |> Query.fromHtml
+ |> Query.has [ Selector.classes classes ]
+ )
+ :: List.map
+ (\className ->
+ test ("Test.Html.Selector.class finds the class: " ++ className) <|
+ \_ ->
+ html
+ |> Query.fromHtml
+ |> Query.has [ Selector.class className ]
+ )
+ classes
+
+
{-|
-}
bug13 : Test
@@ -138,7 +86,7 @@ bug13 =
[ Html.h1 [ Attr.title "greeting", Attr.class "me" ] [ Html.text "Hello!" ] ]
|> Query.fromHtml
|> Query.find [ attribute (Attr.title "greeting") ]
- |> Query.has [ text "Hello!", class "me" ]
+ |> Query.has [ Selector.text "Hello!", Selector.class "me" ]
]