{"id":16710472,"url":"https://github.com/gdotdesign/elm-spec","last_synced_at":"2025-03-21T20:33:07.952Z","repository":{"id":57222604,"uuid":"78619180","full_name":"gdotdesign/elm-spec","owner":"gdotdesign","description":"End-to-end integration testing for Elm apps and components","archived":false,"fork":false,"pushed_at":"2018-05-21T18:11:33.000Z","size":124,"stargazers_count":56,"open_issues_count":3,"forks_count":6,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-10-13T20:08:33.169Z","etag":null,"topics":["elm","elm-spec","end-to-end-testing","testing","testing-tools"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/gdotdesign.png","metadata":{"files":{"readme":"Readme.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-01-11T08:36:41.000Z","updated_at":"2024-09-06T13:37:59.000Z","dependencies_parsed_at":"2022-08-29T02:12:59.676Z","dependency_job_id":null,"html_url":"https://github.com/gdotdesign/elm-spec","commit_stats":null,"previous_names":[],"tags_count":17,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gdotdesign%2Felm-spec","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gdotdesign%2Felm-spec/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gdotdesign%2Felm-spec/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/gdotdesign%2Felm-spec/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/gdotdesign","download_url":"https://codeload.github.com/gdotdesign/elm-spec/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":221818570,"owners_count":16885776,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["elm","elm-spec","end-to-end-testing","testing","testing-tools"],"created_at":"2024-10-12T20:08:34.911Z","updated_at":"2024-10-28T10:47:33.992Z","avatar_url":"https://github.com/gdotdesign.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# elm-spec\n[![Build Status](https://travis-ci.org/gdotdesign/elm-spec.svg?branch=master)](https://travis-ci.org/gdotdesign/elm-spec)\n[![Npm Version](https://badge.fury.io/js/elm-spec.svg)](https://badge.fury.io/js/elm-spec)\n[![Documentation](https://img.shields.io/badge/documentation-elm--directory-brightgreen.svg)](http://elm-directory.herokuapp.com/package/gdotdesign/elm-spec)\n\nEnd-to-end testing for your Elm apps and components.\n\n## Features\n* Can test apps or separate components\n* `Task` based steps and assertions (allows createing custom ones easily)\n* Create composite steps from other steps\n* DOM steps and assertions (`click`, `containsText`, `valueEquals`, etc...)\n* Mock HTTP requests and report not mocked requests\n* `before` / `after` hooks\n* Run tests in the console (via _jsdom_)\n* Run tests with `elm-reactor` with console report\n* Run files one at a time `elm-spec spec/SomeSpec.elm`\n* Run tests one at a time `elm-spec spec/SomeSpec.elm:2`\n\n## CLI\nYou can install the CLI with either of the following commands:\n\n`npm install elm-spec -g` or `yarn global add elm-spec`\n\n```\nelm-spec [glob pattern or file:testID] -f format\n\nOptions:\n  --format, -f  Reporting format\n                [choices: \"documentation\", \"progress\"] [default: \"documentation\"]\n  --help        Show help                                               [boolean]\n\n```\n\n## Adding the package\nAdd `gdotdesign/elm-spec` as a dependency to your `elm-package.json`.\n\n```json\n  \"dependencies\": {\n    \"gdotdesign/elm-spec\": \"1.0.0 \u003c= v \u003c 2.0.0\"\n  }\n```\n\nAnd then install with [elm-github-install](https://github.com/gdotdesign/elm-github-install) using the `elm-install` command.\n\n## Quick Start\nHere is an exmaple of testing a simple component:\n\n```elm\nimport Spec exposing (..)\n\nimport Html.Events exposing (onClick)\nimport Html exposing (div, text)\n\ntype alias Model\n  = String\n\ntype Msg\n  = Set\n\ninit : () -\u003e Model\ninit _ =\n  \"Empty\"\n\nupdate : Msg -\u003e Model -\u003e ( Model, Cmd Msg )\nupdate msg model =\n  case msg of\n    Set -\u003e\n      ( \"Something\", Cmd.none )\n\nview : Model -\u003e Html.Html Msg\nview model =\n  div [ onClick Set ] [ text model ]\n\nspecs : Node\nspecs =\n  describe \"Example\"\n    [ it \"clicking on the div should change the text\"\n      [ assert.containsText { text = \"Empty\", selector = \"div\" }\n      , steps.click \"div\"\n      , assert.containsText { text = \"Something\", selector = \"div\" }\n      ]\n    ]\n\nmain =\n  runWithProgram\n    { subscriptions = \\_ -\u003e Sub.none\n    , update = update\n    , view = view\n    , init = init\n    } specs\n```\n\nAnd open the file in `elm-reactor` or run it wit the `elm-spec` command:\n\n```\n$ elm-spec spec/ExampleSpec.elm\n◎ spec/ExampleSpec.elm\n  Example\n    ✔ clicking on the div should change the text\n      Element div contains text \"Empty\"\n      Clicked: div\n      Element div contains text \"Something\"\n\n1 files 1 tests:\n 3 steps: 3 successfull, 0 failed, 0 errored\n 0 requests: 0 called, 0 not called, 0 unhandled\n```\n\n## Defining tests\nYou can define tests with the `it` or `test` functions:\n\n```elm\nit \"does something\"\n  [ step1\n  , assertion1\n  , step2\n  , assertion2\n  ]\n```\n\nEach test can have an unlimited number of steps (`Task Never Outcome`) which\nare executed in sequence.\n\nBefore every test the given application is reset and a fresh DOM is created.\n\n## Defining Groups\nYou can define groups that can have an tests, hooks and groups. There are three\nfunctions that do the same thing: `group`, `context`, `describe`.\n\n```elm\ncontext \"Something\"\n  [ describe \"Something else\"\n    [ it \"does something\"\n      [ step1\n      , assertion1\n      ]\n    ]\n  ]\n```\n\n## Hooks\nElm-spec allows you to append and prepend steps and assertions before each test\nwith the `before` and `after` functions.\n\nThese functions can be defined in a group and it will add it's steps to each\ntest in that group and it's descendant groups tests (recursively).\n\n```elm\ncontext \"Something\"\n  [ describe \"Something else\"\n    [ before\n      [ preparationStep1\n      ]\n    , after\n      [ cleanupStep1\n      ]\n    , it \"does something\"\n      [ step1\n      , assertion1\n      ]\n    ]\n  ]\n```\n\n## Steps and Assertions\nThe following steps are available in the `steps` record:\n\n```elm\n{ dispatchEvent : String -\u003e Json.Value -\u003e String -\u003e Step\n, getAttribute : String -\u003e String -\u003e Task Never String\n, setValue : String -\u003e String -\u003e Step\n, getTitle : Task Never String\n, clearValue : String -\u003e Step\n, getUrl : Task Never String\n, click : String -\u003e Step\n}\n```\n\nAnd the following assertions are available in the `assert` and `assert.not`\nrecords:\n\n```elm\n{ attributeContains : AttributeData -\u003e Assertion\n, attributeEquals : AttributeData -\u003e Assertion\n, inlineStyleEquals : StyleData -\u003e Assertion\n, valueContains : TextData -\u003e Assertion\n, classPresent : ClassData -\u003e Assertion\n, containsText : TextData -\u003e Assertion\n, styleEquals : StyleData -\u003e Assertion\n, elementPresent : String -\u003e Assertion\n, elementVisible : String -\u003e Assertion\n, titleContains : String -\u003e Assertion\n, valueEquals : TextData -\u003e Assertion\n, titleEquals : String -\u003e Assertion\n, urlContains : String -\u003e Assertion\n, urlEquals : String -\u003e Assertion\n}\n```\n\n## Step groups\nYou can define a new step that is composed of many other steps but appear as\none step in the results with the `stepGroup` function. If any of the defined\nsteps fails the new step fails as well.\n\n```elm\nmyStep =\n  stepGroup \"Descripiton of the step\"\n    [ step1\n    , assertion1\n    ]\n\nspec =\n  it \"does something\"\n    [ myStep\n    , step2\n    ]\n```\n\n## Examples\nYou can see examples of tests written in elm-spec in here:\n* https://github.com/gdotdesign/elm-ui/tree/master/spec\n* https://github.com/gdotdesign/elm-dom/tree/master/spec\n* https://github.com/gdotdesign/elm-storage/tree/master/spec\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgdotdesign%2Felm-spec","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fgdotdesign%2Felm-spec","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fgdotdesign%2Felm-spec/lists"}