Browser.Navigation fires on `a` elements w/o `href` attribute

I’m currently upgrading an app from 0.18 to 0.19 and noticed that the Browser package doesn’t seem to handle navigation of a tags w/o the href element correctly. According to https://www.w3.org/TR/2016/REC-html51-20161101/links.html#element-attrdef-a-href the href attribute is not required and when it is not present it does not create a hyperlink.

Is this a bug in the Browser package? Below is an example program. You will notice that clicking the “test w/o href” a element will result in a page reload even though there is no href present.

module Main exposing (main)

import Browser exposing (Document, UrlRequest)
import Browser.Navigation as Nav
import Html exposing (Html, a, button, div, p, text)
import Html.Attributes exposing (href)
import Html.Events exposing (onClick)
import Json.Decode as Decode
import Url exposing (Url)


type alias Model =
    { internalCount : Int
    , externalCount : Int
    , navKey : Nav.Key
    , url : Url
    }


init : Decode.Value -> Url -> Nav.Key -> ( Model, Cmd Msg )
init flags url navKey =
    ( { internalCount = 0, externalCount = 0, url = url, navKey = navKey }, Cmd.none )


type Msg
    = UrlRequested UrlRequest
    | UrlChanged Url


update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        UrlRequested request ->
            case Debug.log "request" request of
                Browser.Internal url ->
                    ( { model | internalCount = model.internalCount + 1 }, Nav.pushUrl model.navKey (Url.toString url) )

                Browser.External href ->
                    ( { model | externalCount = model.externalCount + 1 }, Nav.load href )

        UrlChanged url ->
            ( { model | url = url }, Cmd.none )


subscriptions : Model -> Sub Msg
subscriptions model =
    Sub.none


view : Model -> Document Msg
view model =
    { title = "a tag w/o href"
    , body =
        [ div []
            [ p []
                [ text "Internal Count: "
                , text <| String.fromInt model.internalCount
                ]
            , p []
                [ text "External Count: "
                , text <| String.fromInt model.externalCount
                ]
            , p [] [ a [ href "/test" ] [ text "test w/ href" ] ]
            , p [] [ a [] [ text "test w/o href" ] ]
            ]
        ]
    }


main : Program Decode.Value Model Msg
main =
    Browser.application
        { init = init
        , view = view
        , update = update
        , subscriptions = subscriptions
        , onUrlRequest = UrlRequested
        , onUrlChange = UrlChanged
        }
1 Like

This is a known issue. See:

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.