diff --git a/src/Test/Html/Internal/ElmHtml/Query.elm b/src/Test/Html/Internal/ElmHtml/Query.elm index 64b1c36c..8482e5ec 100644 --- a/src/Test/Html/Internal/ElmHtml/Query.elm +++ b/src/Test/Html/Internal/ElmHtml/Query.elm @@ -262,8 +262,25 @@ hasStyle style facts = classnames : Facts msg -> List String classnames facts = - Dict.get "className" facts.stringAttributes - |> Maybe.withDefault "" + (case ( Dict.get "class" facts.stringAttributes, Dict.get "className" facts.stringAttributes ) of + ( Just _, Just _ ) -> + -- If you use both the `class` attribute and the `className` property at the same time, + -- it’s undefined which classes you end up with. It depends on which order they are specified, + -- which order elm/virtual-dom happens to apply them, and which of them changed most recently. + -- Mixing both is not a good idea. Ideally, we’d show some nice error message explaining this + -- here, but since this is very much an edge case it does not feel worth the complexity. + -- Instead, silently claim that there are no classes (that no classes match the node). + "" + + ( Just class, Nothing ) -> + class + + ( Nothing, Just className ) -> + className + + ( Nothing, Nothing ) -> + "" + ) |> String.split " " diff --git a/tests/src/Test/Html/QueryTests.elm b/tests/src/Test/Html/QueryTests.elm index 134ff5c2..198d7b01 100644 --- a/tests/src/Test/Html/QueryTests.elm +++ b/tests/src/Test/Html/QueryTests.elm @@ -113,6 +113,27 @@ all = [ Query.has [ attribute (Attr.property "className" (Encode.string "hello world")) ] , Query.has [ attribute (Attr.property "className" (Encode.string "world hello")) ] ] + , test "matches a class added using Attr.attribute" <| + \() -> + divWithAttribute (Attr.attribute "class" "hello") + |> Query.fromHtml + |> Query.has [ class "hello" ] + , test "matches a class added using Attr.property" <| + \() -> + divWithAttribute (Attr.property "className" (Encode.string "hello")) + |> Query.fromHtml + |> Query.has [ class "hello" ] + , test "matches nothing if classes are added both using Attr.attribute and Attr.property" <| + \() -> + Html.div + [ Attr.attribute "class" "hello" + , Attr.property "className" (Encode.string "world") + ] + [] + |> Query.fromHtml + |> Query.has [ class "hello" ] + |> expectationToIsPassing + |> Expect.equal False ] ] , describe "Query.contains" <|