{"id":13808080,"url":"https://github.com/allenhwkim/ngentest","last_synced_at":"2025-04-09T21:22:35.063Z","repository":{"id":32285461,"uuid":"132154139","full_name":"allenhwkim/ngentest","owner":"allenhwkim","description":"Angular6+ Unit Test Generator For Components, Directive, Services, and Pipes","archived":false,"fork":false,"pushed_at":"2024-05-02T13:03:09.000Z","size":722,"stargazers_count":143,"open_issues_count":5,"forks_count":59,"subscribers_count":11,"default_branch":"main","last_synced_at":"2025-04-02T19:04:28.757Z","etag":null,"topics":["angular","generator","parser","typescript","unittest"],"latest_commit_sha":null,"homepage":"https://ngentest.github.io","language":"TypeScript","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/allenhwkim.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.md","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":"2018-05-04T14:57:52.000Z","updated_at":"2025-02-05T02:04:26.000Z","dependencies_parsed_at":"2024-05-02T14:38:28.176Z","dependency_job_id":null,"html_url":"https://github.com/allenhwkim/ngentest","commit_stats":null,"previous_names":["allenhwkim/ng-gen-test"],"tags_count":52,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/allenhwkim%2Fngentest","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/allenhwkim%2Fngentest/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/allenhwkim%2Fngentest/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/allenhwkim%2Fngentest/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/allenhwkim","download_url":"https://codeload.github.com/allenhwkim/ngentest/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247878007,"owners_count":21011158,"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":["angular","generator","parser","typescript","unittest"],"created_at":"2024-08-04T01:01:34.707Z","updated_at":"2025-04-09T21:22:35.044Z","avatar_url":"https://github.com/allenhwkim.png","language":"TypeScript","funding_links":[],"categories":["Table of contents"],"sub_categories":["Angular"],"readme":"# ngentest\nAngular6,7,8,9,10,11,12,13,14,15,16 Unit Test Generator For Components, Directive, Services, and Pipes\n\n## Install \u0026 Run\n```bash\n$ npm install ngentest -D\n$ npx ngentest -h          \nUsage: index.js \u003ctsFile\u003e [options]\n\nOptions:\n      --version     Show version number                                [boolean]\n  -s, --spec        write the spec file along with source file         [boolean]\n  -f, --force       It prints out a new test file, and it does not ask a\n                    question when overwrite spec file                  [boolean]\n  -v, --verbose     log verbose debug messages                         [boolean]\n      --framework   test framework, jest or karma                       [string]\n  -c, --config      The configuration file to load options from\n                                        [string] [default: \"ngentest.config.js\"]\n  -h                Show help                                          [boolean]\n\nExamples:\n  index.js my.component.ts  generate Angular unit test for my.component.ts\n\n$ npx ngentest my.component.ts \n$ npx ngentest my.directive.ts -s # write unit test to my.directive.spec.ts\n$ npx ngentest my.directive.ts -c ../ngentest.config.js # use different config file.\n```\n\nTo see the source file and generated examples, please take a look at `test-examples` directory.\nhttps://github.com/allenhwkim/ngentest/tree/master/test-examples\n\n## Config\nYou can override configuration by creating a file named as `ngentest.config.js` in your application directory and running ngentest from that directory. You can also provide a configuration file using `-c my.config.js`.\nIf you want to use your own config, refer [the default config file](https://github.com/allenhwkim/ngentest/blob/main/ngentest.config.js)\n\n  * **framework**: `jest` or `karma`. The default is `jest`. This value determines how function mock and assert is to be done.\n\n  * **outputTemplates**: template string for each type. Please specify your own template if you want to override the default template. There are five types;\n    * klass: ejs template for an ES6 class without angular decorator.\n    * component: ejs template for an Angular component.\n    * directive: ejs template for an Angular directive.\n    * injectable: ejs template for an Angular service.\n    * pipe: ejs template for an Angular pipe.\n\n    e.g., \n    ```javascript\n    outputTemplates: {\n      klass: myKlassTemplate, \n      component: myComponentTemplate,\n      directive: myDirectiveTemplate,\n      injectable: myInjectableTemplate, \n      pipe: myPipeTemplate \n    }\n    ```\n\n  * **directives**: Array of diretive names, necessary for a component test. e.g., \n    ```javascript\n    directives: ['myDirective']\n    ```\n\n  * **pipes**: Array of pipe names, necessary for a component test. e.g. \n    ```javascript\n    pipes: ['translate', 'phoneNumber', 'safeHtml']\n    ```\n\n  * **replacements**: There are some codes, which causes error without proper environment. You need to replace these codes.\n    You can specify `from` value with regular expression and `to` value with string.\n    e.g. \n    ```javascript\n    replacements: [\n      { from: '^\\\\S+\\\\.define\\\\(.*\\\\);', to: ''}`\n    ]\n    ```\n\n  * **providerMocks**: When the following class is used in a constructor parameter, create a mock class with the given statements.\n    e.g.\n    ```javascript\n    providerMocks: {\n      ElementRef: ['nativeElement = {};'],\n      Router: ['navigate() {};'],\n      Document: ['querySelector() {};'],\n      HttpClient: ['post() {};'],\n      TranslateService: ['translate() {};'],\n      EncryptionService: [],\n    }\n    ```\n\n  ### Full Example (https://github.com/allenhwkim/ngentest/blob/master/ngentest.config.js)\n  ```javascript\n  module.exports = {\n    framework: 'karma', // or 'jest'\n    outputTemplates: {\n      klass: klassTemplate,  // ejs contents read from file\n      component: componentTemplate,\n      directive: directiveTemplate,\n      injectable: injectableTemplate, \n      pipe: pipeTemplate \n    },\n    // necessary directives used for a component test\n    directives: [\n      // 'myCustomDirective' // my custom directive used over application\n    ], \n    // necessary pipes used for a component test\n    pipes: [\n      'translate', 'phoneNumber', 'safeHtml'\n    ],\n    // when convert to JS, some codes need to be replaced to work \n    replacements: [ // some 3rd party module causes an error\n      { from: '^\\\\S+\\\\.define\\\\(.*\\\\);', to: ''} // some commands causes error\n    ],\n    // when constructor param type is as following, create a mock class with this properties\n    // e.g. @Injectable() MockElementRef { nativeElement = {}; }\n    providerMocks: {\n      ElementRef: ['nativeElement = {};'],\n      Router: ['navigate() {};'],\n      Document: ['querySelector() {};'],\n      HttpClient: ['post() {};'],\n      TranslateService: ['translate() {};'],\n      EncryptionService: [],\n    }\n  }\n  ```\n\n## How It works\n\n1. Parse a Typescript file and find these info.\n\n    * imports: imports statements info.\n    * inputs: @Input statements info.\n    * outputs: @Output statements info.\n    * component provider: providers info used in @Component decorator.\n    * selector: selector info used in @Component or @Directove decorator.\n\n2. Compile Typescript to Javascript, then parse the Javascript, and get the following info.\n\n    * constructor param data\n    * provider mock data\n    * accessor tests\n    * function tests\n\n3. build ejs data from #1 and #2, and generate test code.\n\n## For Developers: \n\n### Directory structure\n* `api` directory:\n  - source code to run this as an API\n  - To run local express server, `node api/express-server.js`\n  - `api/index.js` is a structure [used by Vercel](https://vercel.com/guides/using-express-with-vercel#standalone-express)\n\n* `ejs-template` directory:\n  - default EJS templates for unit test generation\n* `test` directory:\n  - All test files including unit test goes here\n* `cli.js`: \n  - used as `ngentest` command\n* `ngentest.config.js`: \n  - The default configuration file used by `cli.js`\n* `vercel.json`: \n  - Used to deploy to `https://ngentest.vercel.com/api/ngentest`\n \n### Deployment to Vercel\nWhenever `main` branch is updated, API `https://ngentest.vercel.app/api/ngentest` will be deployed by following `vercel.json`.  \nTo see the usage of this API, refer [this](https://ngentest.vercel.app/api)\n* Deployment setting: https://vercel.com/allenhwkim/ngentest/deployments\n* Project setting https://vercel.com/allenhwkim/ngentest \n\n### To make it sure it does not break any feature\n```\n$ npm i\n\n$ npm test\n\u003e ngentest@2.1.1 test\n\u003e node --test test/*.spec.js \u0026\u0026 node test/index.js\n▶ TypescriptParser\n...\n▶ Util\n...\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example.klass.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example.component.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example2.component.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example3.component.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example4.component.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example5.component.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example6.component.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example7.component.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example8.component.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example9.component.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/exampleX.component.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example.directive.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example.service.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example.pipe.ts\npassed check /Users/allenkim/projects/ngentest/test/test-examples/example2.pipe.ts\n\n```\n\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fallenhwkim%2Fngentest","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fallenhwkim%2Fngentest","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fallenhwkim%2Fngentest/lists"}