{"id":16439151,"url":"https://github.com/posva/mocha-css","last_synced_at":"2025-10-10T07:34:48.443Z","repository":{"id":57299771,"uuid":"74825333","full_name":"posva/mocha-css","owner":"posva","description":"A mocha stylesheet for the HTML reporter that let you append visual tests","archived":false,"fork":false,"pushed_at":"2019-06-18T23:03:13.000Z","size":24,"stargazers_count":7,"open_issues_count":0,"forks_count":1,"subscribers_count":3,"default_branch":"master","last_synced_at":"2024-12-28T21:03:23.441Z","etag":null,"topics":["browser","css","mocha","test","visual-testing"],"latest_commit_sha":null,"homepage":null,"language":"CSS","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/posva.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":".github/CONTRIBUTING.md","funding":".github/funding.yml","license":"LICENSE.md","code_of_conduct":".github/CODE_OF_CONDUCT.md","threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"github":"posva","patreon":"posva","custom":"https://www.paypal.me/posva"}},"created_at":"2016-11-26T12:48:06.000Z","updated_at":"2020-05-20T17:03:43.000Z","dependencies_parsed_at":"2022-08-26T17:01:09.638Z","dependency_job_id":null,"html_url":"https://github.com/posva/mocha-css","commit_stats":null,"previous_names":[],"tags_count":1,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/posva%2Fmocha-css","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/posva%2Fmocha-css/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/posva%2Fmocha-css/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/posva%2Fmocha-css/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/posva","download_url":"https://codeload.github.com/posva/mocha-css/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":232615199,"owners_count":18550648,"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":["browser","css","mocha","test","visual-testing"],"created_at":"2024-10-11T09:08:11.851Z","updated_at":"2025-10-10T07:34:43.402Z","avatar_url":"https://github.com/posva.png","language":"CSS","readme":"# mocha-css\n\n\u003e A mocha stylesheet for the HTML reporter that let you append visual tests\n\n[![CircleCI][circleci-image]][circleci-url] [![npm][npm-image]][npm-url] [![license][license-image]][license-url]\n\n![mocha-css](https://cloud.githubusercontent.com/assets/664177/20640621/7cc2fa32-b3e3-11e6-8db0-f927e67a2584.png)\n\nIn the screenshot below the `h1` element doesn't have the original mocha.css\nstyle applied.\n\nYou have to make sure to reset the `font` property on your visual test\ncontainer. eg: If you apply the class `test-dom-container` to all of them, You'll\nhave to add this CSS snippet:\n\n``` css\n.test-dom-container {\n  font: initial;\n}\n```\n\n## Installation\n\n**NPM**\n\n``` sh\nnpm install --save-dev mocha-css\n```\n\n## Usage\n\nSimply replace the `mocha.css` file you're importing with this one\n\n**Webpack**\n\n``` js\n// es6\nimport 'mocha-css'\n// commonjs\nrequire('mocha-css')\n// with loader query\nimport 'style-loader!css-loader!mocha-css'\n```\n\n**CDN**\n\n``` html\n\u003clink href=\"https://unpkg.com/mocha-css\" rel=\"stylesheet\" /\u003e\n```\n\n[license-image]: https://img.shields.io/npm/l/normalize.css.svg?style=flat-square\n[license-url]: LICENSE.md\n[npm-image]: https://img.shields.io/npm/v/mocha-css.svg?style=flat-square\n[npm-url]: https://www.npmjs.com/package/mocha-css\n[circleci-image]: https://circleci.com/gh/posva/mocha-css/tree/master.svg?style=shield\n[circleci-url]: https://circleci.com/gh/posva/mocha-css\n\n## What is visual testing?\n\nVisual testing consists in seeing what your tests are doing. This is useful when\nauthoring a UI component library because you always want to check what your\ncomponent looks like.\n\n### Resources\n\n- [Visual TDD and awesome documentation](http://toucantoco.com/front/2016/09/14/visual-tdd.html)\n","funding_links":["https://github.com/sponsors/posva","https://patreon.com/posva","https://www.paypal.me/posva"],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fposva%2Fmocha-css","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fposva%2Fmocha-css","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fposva%2Fmocha-css/lists"}