<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>stryker Archives - Yumasoft</title>
	<atom:link href="https://blog.yumasoft.pl/tag/stryker/feed/" rel="self" type="application/rss+xml" />
	<link>https://blog.yumasoft.pl/tag/stryker/</link>
	<description>Software development blog</description>
	<lastBuildDate>Wed, 14 Jul 2021 04:17:14 +0000</lastBuildDate>
	<language>en-US</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.9.4</generator>

<image>
	<url>https://blog.yumasoft.pl/wp-content/uploads/2021/05/cropped-yumasoft_icon_transparent-32x32.png</url>
	<title>stryker Archives - Yumasoft</title>
	<link>https://blog.yumasoft.pl/tag/stryker/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>How To Use StrykerJS With jest And TypeScript</title>
		<link>https://blog.yumasoft.pl/2021/07/how-to-use-strykerjs-with-jest-and-typescript/</link>
					<comments>https://blog.yumasoft.pl/2021/07/how-to-use-strykerjs-with-jest-and-typescript/#respond</comments>
		
		<dc:creator><![CDATA[Dawid Sibiński]]></dc:creator>
		<pubDate>Wed, 14 Jul 2021 06:00:00 +0000</pubDate>
				<category><![CDATA[Programming]]></category>
		<category><![CDATA[javascript]]></category>
		<category><![CDATA[jest]]></category>
		<category><![CDATA[mutation tests]]></category>
		<category><![CDATA[software testing]]></category>
		<category><![CDATA[stryker]]></category>
		<category><![CDATA[stryker mutator]]></category>
		<category><![CDATA[strykerjs]]></category>
		<category><![CDATA[testing]]></category>
		<category><![CDATA[tests]]></category>
		<category><![CDATA[typescript]]></category>
		<guid isPermaLink="false">https://blog.yumasoft.pl/?p=407</guid>

					<description><![CDATA[<p>Continuing the topic of frontend tests with jest, we&#8217;re taking a look at StrykerJS today. Stryker Mutator is one of the most popular tools for mutation testing. We recently struggled with configuring StykerJS to work properly with jest and TypeScript. I&#8217;d like to share our solution to these problems in this article. Jest config First,&#8230;</p>
<p>The post <a rel="nofollow" href="https://blog.yumasoft.pl/2021/07/how-to-use-strykerjs-with-jest-and-typescript/">How To Use StrykerJS With jest And TypeScript</a> appeared first on <a rel="nofollow" href="https://blog.yumasoft.pl">Yumasoft</a>.</p>
]]></description>
										<content:encoded><![CDATA[
<p>Continuing <a href="https://blog.yumasoft.pl/2021/07/how-to-configure-jest-tests-on-teamcity/">the topic of frontend tests</a> with <code>jest</code>, we&#8217;re taking a look at StrykerJS today. Stryker Mutator is one of the most popular tools for mutation testing. We recently struggled with configuring StykerJS to work properly with <code>jest</code> and TypeScript. I&#8217;d like to share our solution to these problems in this article.</p>



<span id="more-407"></span>



<h2 class="wp-block-heading">Jest config</h2>



<p>First, make sure that your <a href="https://jestjs.io/docs/configuration"><code>jest</code> configuration</a> is correct. If you&#8217;re with TypeScript (and you <a href="https://blog.yumasoft.pl/2021/06/migrating-javascript-react-app-to-typescript/">should</a> ?), I recommend using <a href="https://www.npmjs.com/package/ts-jest">ts-jest</a> configuration preset. Our config looks as follows:</p>



<script src="https://gist.github.com/dsibinski/04419106e45b2136f63c2255a8a77fba.js"></script>



<p>If everything is fine, you should be able to execute <code>npm test</code> command (assuming it&#8217;s defined in <code>package.json</code> as <code>"test": "jest"</code>) without issues. All your tests should be executed.</p>



<p>We now need to make StrykerJS working with that.</p>



<h2 class="wp-block-heading">StrykerJS with jest configuration</h2>



<p>If you install <a href="https://www.npmjs.com/package/@stryker-mutator/core">StrykerJS</a> as described <a href="https://github.com/stryker-mutator/stryker-js">here</a>, you&#8217;d expect that <code>npx stryker run</code> command runs mutations and everything is just fine. However, if you&#8217;re having wierd issues and errors with that, it probably means that Stryker is not properly configured to execute tests with <code>jest</code>.</p>



<p>When you run <code>npx stryker run</code>, it creates mutants (modifications in your source code) and runs tests against them. It means that StrykerJS must run your tests in the same way you run them. So, if you run tests with <code>jest</code>, Stryker must be able to do the same.</p>



<p>We struggled with many issues related to running StrykerJS with <code>jest</code>. Some of them were related purely to <code>jest</code>, but some of them to TypeScript as well. After numerous trial-and-errors and consulting with StrykerJS community members, we worked out a configuration that finally works fine for us.</p>



<p>Going straight to the point, here&#8217;s the <code>stryker.conf.json</code> file that would make StrykerJS work fine with <code>jest</code> and TypeScript:</p>



<script src="https://gist.github.com/dsibinski/116b47fe141aaf7f71b2e8f1c83137b2.js"></script>



<p>To make it work, install the following npm packages: <a href="https://www.npmjs.com/package/@stryker-mutator/core">@stryker-mutator/core</a>, <a href="https://www.npmjs.com/package/@stryker-mutator/jest-runner">@stryker-mutator/jest-runner</a> and <a href="https://www.npmjs.com/package/@stryker-mutator/typescript-checker">@stryker-mutator/typescript-checker</a>.</p>



<p>Notice few important settings here:</p>



<ul class="wp-block-list"><li> <code>"checkers": ["typescript"]</code> &#8211; this enabled a <a href="https://stryker-mutator.io/docs/stryker-js/typescript-checker/">TypeScript checker</a> plugin, which makes mutations being checked for types before running tests on them. It means that if a mutation introduced by Stryker doesn&#8217;t compile because of types issues, it won&#8217;t be taken into account for mutations (which makes perfect sense)</li><li>&#8220;<code>disableTypeChecks</code>&#8221; &#8211; you still need to tell StrykerJS to not check types when compiling your code with type errors (mutants). It will compile them without types checking, but thanks to TypeScript checker plugin these ones will be filtered out for mutations</li><li><code>"tsconfigFile": "tsconfig.json"</code> &#8211; make sure to point to the TS config file you&#8217;re using here</li><li><code>"concurrency": 4</code>: this is another setting we experimented with to make Stryker working correctly. Without it, we were getting weird errors about lack of memory when running mutations (<code>FATAL ERROR: Committing semi space failed. Allocation failed - JavaScript heap out of memory</code>)</li><li><code>"testRunner": "jest"</code> &#8211; this one enables the <code>jest</code> as our tests runner</li><li><code>"jest"</code> &#8211; here you tell Stryker to use your <code>jest.config.js</code> file we talked about at the beginning</li></ul>



<p>With these settings, I hope that you are able to see this beautiful output of <code>npx stryker run</code> in your console:</p>



<div class="wp-block-image"><figure class="aligncenter size-large"><img fetchpriority="high" decoding="async" width="827" height="156" src="https://blog.yumasoft.pl/wp-content/uploads/2021/07/Stryker_mutations_result.png" alt="" class="wp-image-414" srcset="https://blog.yumasoft.pl/wp-content/uploads/2021/07/Stryker_mutations_result.png 827w, https://blog.yumasoft.pl/wp-content/uploads/2021/07/Stryker_mutations_result-300x57.png 300w, https://blog.yumasoft.pl/wp-content/uploads/2021/07/Stryker_mutations_result-768x145.png 768w" sizes="(max-width: 827px) 100vw, 827px" /></figure></div>



<h2 class="wp-block-heading">StrykerJS with jest and TypeScript &#8211; summary</h2>



<p>I hope this is helpful for you. StrykerJS is a developing framework, so some things are still hard to figure out. We believe mutation tests are a great way of improving our tests, so we use them on a daily basis. If you ever have any issues with StrykerJS, I encourage you to reach out to <a href="https://join.slack.com/t/stryker-mutator/shared_invite/enQtOTUyMTYyNTg1NDQ0LTU4ODNmZDlmN2I3MmEyMTVhYjZlYmJkOThlNTY3NTM1M2QxYmM5YTM3ODQxYmJjY2YyYzllM2RkMmM1NjNjZjM">the community on Slack</a>. They are extremely helpful there ?</p>
<p>The post <a rel="nofollow" href="https://blog.yumasoft.pl/2021/07/how-to-use-strykerjs-with-jest-and-typescript/">How To Use StrykerJS With jest And TypeScript</a> appeared first on <a rel="nofollow" href="https://blog.yumasoft.pl">Yumasoft</a>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://blog.yumasoft.pl/2021/07/how-to-use-strykerjs-with-jest-and-typescript/feed/</wfw:commentRss>
			<slash:comments>0</slash:comments>
		
		
			</item>
	</channel>
</rss>
