{"id":13724983,"url":"https://github.com/afonsonf/tlaplus-graph-explorer","last_synced_at":"2025-05-07T19:32:16.657Z","repository":{"id":45895594,"uuid":"354920212","full_name":"afonsonf/tlaplus-graph-explorer","owner":"afonsonf","description":"A static web application to explore and animate a TLA+ state graph.","archived":false,"fork":false,"pushed_at":"2023-11-08T23:22:34.000Z","size":6044,"stargazers_count":197,"open_issues_count":0,"forks_count":2,"subscribers_count":4,"default_branch":"main","last_synced_at":"2024-11-14T15:38:50.020Z","etag":null,"topics":["javascript","tlaplus"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/afonsonf.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2021-04-05T17:45:38.000Z","updated_at":"2024-11-14T03:56:18.000Z","dependencies_parsed_at":"2024-11-14T15:36:21.456Z","dependency_job_id":"a76cfabb-d88f-49f7-8f8d-bdcb19bfadd0","html_url":"https://github.com/afonsonf/tlaplus-graph-explorer","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/afonsonf%2Ftlaplus-graph-explorer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/afonsonf%2Ftlaplus-graph-explorer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/afonsonf%2Ftlaplus-graph-explorer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/afonsonf%2Ftlaplus-graph-explorer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/afonsonf","download_url":"https://codeload.github.com/afonsonf/tlaplus-graph-explorer/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":252943833,"owners_count":21829318,"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":["javascript","tlaplus"],"created_at":"2024-08-03T01:02:08.731Z","updated_at":"2025-05-07T19:32:15.197Z","avatar_url":"https://github.com/afonsonf.png","language":"JavaScript","readme":"# TLA+ Graph Explorer\nThis is a static web application to explore and visualize a TLA+ state graph or a TLA+ trace.\n\nThe application works by parsing a dot file generated by a TLA+ specification and then having visual representations to more easily understand and go through the reachable states.\n\nThe application is written to support big dot files and not load the whole file into memory. This is achieved by reading the file in chunks and storing only the location of the node in the file. The structure to save the nodes location, in my experiments, takes around 1/10th of the dot file size.\n\n## Examples\n\nFor more examples: [examples](examples).\n\n#### Example 1 - Default Configuration\nSpec: [https://github.com/tlaplus/Examples/tree/master/specifications/MissionariesAndCannibals](https://github.com/tlaplus/Examples/tree/master/specifications/MissionariesAndCannibals).\n\n![](examples/default/example.gif)\n\n#### Example 2 - Personalized state\nSpec: [https://github.com/afonsonf/ceph-consensus-spec](https://github.com/afonsonf/ceph-consensus-spec).\n\n![](examples/ceph-consensus/example.gif)\n\n## Usage\n\n### Overview\n\nThe application is in the folder [src](src). To run it, open the index.html file in a browser (tested in Chrome and Firefox).\n\nThe default way to represent a state is showing the pretty printed version, as shown previously in example 1.\n\nThe representation of a state can be personalized by changing the function drawState in the file [tla-state.js](src/tla-state.js). An example of a personalized state representation is shown in the example 2 and the source code is in [examples/ceph-consensus](examples/ceph-consensus). There are other examples in the folder [examples](examples).\n\nTo help create a personalized representation of a state, the application comes with a parser that parses a tla+ state into JavaScript structures. The parser definition is in folder [expr-parser](expr-parser) and example usage of the parser (function parseVars) can be found in the examples.\n\n### Obtain a dot file for state exploration\n\nUsing cli:\n\n```shell\nexport TLA_PATH=path/to/tla\nalias tlc=\"java -cp $TLA_PATH/tla2tools.jar tlc2.TLC\"\n\ntlc -dump dot spec.dot spec.tla\n# Open the .dot file in the application in graph explorer mode (index.html)\n```\n\nUsing the toolbox:\n\n* Create a model\n* Enable graph feature at:\n  * Model Overview \u003e Additional TLC Options \u003e Features \u003e Visualize state graph\n* Run the model\n* Open the folder of the spec in your file explorer\n  * There should be a .toolbox folder with a folder for each model run\n* Open the .dot file in the application in graph explorer mode (index.html)\n\n### Obtain a trace output for trace exploration\n\nUsing the cli:\n\n```shell\nexport TLA_PATH=path/to/tla\nalias tlc=\"java -cp $TLA_PATH/tla2tools.jar tlc2.TLC\"\n\ntlc -tool spec.tla \u003e spec.out\n# Open the .out file in the application in trace mode (trace-explorer.html) \n```\n\nUsing the toolbox:\n\n* Create and run a model\n* Open the folder of the spec in your file explorer\n  * There should be a .toolbox folder with a folder for each model run\n* Open the .out file in the application in trace explorer mode (trace-explorer.html)\n\n## Related tools\n\nThe ideas behind this tool were inspired by [TLA+ Animation Module](https://github.com/will62794/tlaplus_animation) and [Runway](https://github.com/salesforce/runway-browser).\n","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fafonsonf%2Ftlaplus-graph-explorer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fafonsonf%2Ftlaplus-graph-explorer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fafonsonf%2Ftlaplus-graph-explorer/lists"}