<p>Prism has a test suite, that ensures that the correct tokens are matched.</p>
</header>
<sectionid="running-the-test-suite">
<h1>Running the test suite</h1>
<p>Running the test suite is simple: just call <codeclass="language-bash">npm test</code>.</p>
<p>All test files are run in isolation. A new prism instance is created for each test case. This will slow the test runner a bit down, but we can be sure that nothing leaks into the next test case.</p>
<p>To run the tests only for one language, you can use the <code>language</code> parameter: <codeclass="language-bash">npm run test:languages -- --language=markup</code>.</p>
<p>You can even specify multiple languages: <codeclass="language-bash">npm run test:languages -- --language=markup --language=css</code>.</p>
<p>Thank you for writing tests! Tests are awesome! They ensure, that we can improve the codebase without breaking anything. Also, this way, we can ensure that upgrading Prism is as painless as possible for you.</p>
<p>You can add new tests by creating a new test case file (with the <code>.test</code> file extension) in the tests directory which is located at <code>/tests/languages/${language}</code>.</p>
<sectionid="writing-tests-directories">
<h2>Language directories</h2>
<p>All tests are sorted into directories in the <code>tests/languages</code> directory. Each directory name encodes, which language you are currently testing.</p>
<p><strong>All language names must match the names from the definition in <code>components.js</code>.</strong></p>
<h3>Example 1: testing a language in isolation (default use case)</h3>
<p>Just put your test file into the directory of the language you want to test.</p>
<p>So, if you want to test CSS, put your test file in <code>/tests/languages/css</code> to test CSS only. If you create a test case in this directory, the test runner will ensure that the <code>css</code> language definition including all required language definitions are correctly loaded.</p>
<h3>Example 2: testing language injection</h3>
<p>If you want to test language injection, you typically need to load two or more languages where one language is the “main” language that is being tested, with all other languages being injected into it.</p>
<p>You need to define multiple languages by separating them using a <code>+</code> sign: <code>markup+php</code>.</p>
<p>The languages are loaded in order, so first markup (+ dependencies) is loaded, then php (+ dependencies). The test loader ensures that no language is loaded more than once (for example if two languages have the same dependencies).</p>
<p>By default the last language is the main language: <code>php+markup</code> will have <code>markup</code> as main language. This is equal to putting your code in the following code block:</p>
<p>If you need to load the languages in a given order, but you don't want to use the last language as main language, you can mark the main language with an exclamation mark: <code>php!+markup</code>. This will use <code>php</code> as main language. (You can only define one main language. The test runner will fail all tests in directories with more than one main language.)</p>
<p><em>Note: by loading multiple languages you can do integration tests (ensure that loading two or more languages together won't break anything).</em></p>
<li><code>{language}_inclusion</code>: test inclusion of one language into the other (example: <code>markup!+css/css_inclusion.test</code> will test CSS inclusion into markup).</li>
<p>You can use all conventions as a prefix, so <code>string_interpolation_feature_inline.test</code> is possible. <strong>But please take a minute or two to think of a proper name of your test case file. You are writing code not only for the computers, but also for your fellow developers.</strong></p>
</section>
<sectionid="writing-tests-writing-your-test">
<h2>Writing your test</h2>
<p>The structure of a test case file is as follows:</p>
<pre><code>
... language snippet...
----
... the simplified token stream you expect ...</code></pre>
This is a comment explaining this test case.</code></pre>
</section>
<section>
<h2>Explaining the simplified token stream</h2>
<p>While compiling, Prism transforms your source code into a token stream. This is basically a tree of nested tokens (or arrays, or strings).</p>
<p>As these trees are hard to write by hand, the test runner uses a simplified version of it.</p>
<p>It uses the following rules:</p>
<ul>
<li><code>Token</code> objects are transformed into an array: <code>[token.type, token.content]</code> (whereas <code>token.content</code> can be a nested structure).</li>
<li>All strings that are either empty or only contain whitespace, are removed from the token stream.</li>
<p>To get a pretty-printed version of the simplified token stream of a failed test, add the <code>--pretty</code> modifier. Keep in mind that the pretty-printed token stream is indented using spaces, you may need to convert these to tabs. (Most editors today have an option which handles the conversion for you.)<br>
<p>For further information: reading the tests of the test runner (<code>tests/testrunner-tests.js</code>) will help you understand the transformation.</p>
<p>Sometimes, using the token stream tests is not powerful enough. By creating a test file with the file extension <code>.js</code> instead of <code>.test</code>, you can make Prism highlight arbitrary pieces of code and check their HTML results.</p>
<p>The language is determined by the folder containing the test file lies, as explained in the previous section.</p>
<p>The structure of your test file will look like this, for example:</p>