<p>The designer is part of PMD’s binary distributions. To <strong>install a distribution</strong>, see the <ahref="pmd_userdocs_installation.html">documentation page about installing PMD</a>.</p>
<p>The app needs JRE 1.8 or above to run. Be aware that on JRE 11+, the JavaFX distribution should be installed separately. Visit the <ahref="https://gluonhq.com/products/javafx/">JavaFX download page</a> to download a distribution, extract it, and set the JAVAFX_HOME environment variable.</p>
<p>If the bin directory of your PMD distribution is on your shell’s path, then you can <strong>launch the app</strong> with</p>
<divclass="alert alert-info"role="alert"><iclass="fas fa-info-circle"></i><b>Note:</b> pmd-ui.jar is not a runnable jar, because it doesn’t include any PMD language module, or PMD Core. </div>
<p>This is to allow easy updating, and let you choose the dependencies you’re interested in.
The available language modules are those on the classpath of the app’s JVM. That’s why it’s recommended to use the standard PMD startup scripts, which setup the classpath with the available PMD libraries.</p>
<h3id="updating">Updating</h3>
<p>The latest version of the designer currently <strong>works with PMD 6.12.0 and above</strong>. You can simply replace pmd-ui-6.X.Y.jar with the <ahref="https://github.com/pmd/pmd-designer/releases">latest build</a> in the installation folder of your PMD distribution, and run it normally. Note that updating may cause some persisted state to get lost, for example the code snippet.</p>
<h1id="usage-reference">Usage reference</h1>
<p>The rule designer is both a tool to inspect the tree on which PMD rules run on, and to write XPath rules in an integrated manner. This page describes the features that enable this.</p>
<h2id="ast-inspection">AST inspection</h2>
<p><imgsrc="images/designer/designer-top.png"alt="Designer top UI"/></p>
<p>You can enter source code in the middle zone.</p>
<ul>
<li>Make sure to select the correct language and version for your source code:
<ul>
<li>Language is set app-wide with the blue button in the menu-bar</li>
<li>If the language has several language versions, you can select a specific one with the choicebox just above the code area</li>
</ul>
</li>
<li>If the source is valid using this setting, the tree to the right will update to display the AST of the code</li>
<li>When selecting a node, the left panel updates with information about a node</li>
</ul>
<h3id="selecting-nodes">Selecting nodes</h3>
<p>There are several ways to focus a node for inspection:</p>
<ul>
<li><strong>From the tree view:</strong> just click on an item
<ul>
<li>Since 6.16.0, the tree view is also searchable: press CTRL+F when it’s focused, or click on the <codeclass="language-plaintext highlighter-rouge">Search</code> button and enter a search query. You can cycle through results with <codeclass="language-plaintext highlighter-rouge">CTRL+TAB</code> or <codeclass="language-plaintext highlighter-rouge">CTRL+F3</code>, and cycle back with <codeclass="language-plaintext highlighter-rouge">CTRL+SHIFT+TAB</code> or <codeclass="language-plaintext highlighter-rouge">CTRL+SHIFT+F3</code></li>
</ul>
</li>
<li><strong>From the crumb bar:</strong> the crumb bar below the code area shows the ancestors of the currently selected node, and is empty if you have no selection:</li>
</ul>
<details><summary>Ancestor crumb bar demo</summary>
<p><imgsrc="images/designer/parents-bar.gif"alt="Ancestor crumb bar demo"/></p>
</details>
<ul>
<li><strong>From the source code:</strong> maintain <strong>CTRL</strong> for a second until the code area becomes mostly blue. Then, each node you hover over on the code area will be selected automatically. Example:</li>
<p>The left panel displays the following information:</p>
<ul>
<li><strong>XPath attributes:</strong> this basically are all the attributes available in XPath queries. Those attributes are wrappers around a Java getter, so you can obtain documentation on the relevant Javadoc (that’s not yet integrated into the designer)</li>
<li><strong>Metrics:</strong> for nodes that support it, the values of metrics are displayed in this panel</li>
<li><strong>Scopes:</strong> This is java specific and displays some representation of the symbol table. You mostly don’t need it. If you select eg a variable id, its usages are already highlighted automatically without opening the panel:</li>
<p>The center is an XPath expression. As you type it, the matched nodes are updated on the right, and highlighted on the code area. Autocompletion is available on some languages.</p>
<p>Note: you can keep several rules in the editor (there’s a tab for each of them).</p>
<h3id="rule-properties">Rule properties</h3>
<p>Above the XPath expression area, the <strong>“Properties”</strong> button allows you to <ahref="pmd_userdocs_extending_defining_properties.html#for-xpath-rules">define new properties</a> for your prototype rule. You can also edit the existing properties.</p>
<p>When you click on it, a small popup appears:</p>
<li>You can edit the name, description, expected type, and default value of the property</li>
<li>All this information is exported with the rule definition (see <ahref="#exporting-to-an-xml-rule">Exporting to an XML rule</a>)</li>
<li>The default value is used unless you’re editing a test case, and you set a custom value for the test case. TODO link</li>
</ul>
<h3id="exporting-to-an-xml-rule">Exporting to an XML rule</h3>
<p>The little <strong>export icon</strong> next to the gear icon opens a menu to export your rule. This menu lets you fill-in the metadata necessary for an XPath rule to be included in a ruleset.</p>
<p>PMD has its own XML format to describe rule tests and execute them using our test framework. The designer includes a test editor, which allows you to edit such files or create a new one directly as you edit the rule. This is what the panel left of the XPath expression area is for.</p>
<p>See also <ahref="pmd_userdocs_extending_testing.html">the test framework documentation</a>.</p>
<h3id="testing-model">Testing model</h3>
<p>A rule test describes</p>
<ul>
<li>the configuration of the rule</li>
<li>the source on which to run</li>
<li>the expected violations</li>
<li>a description (to name the test)</li>
</ul>
<p>When executing a test, the rule is run on the source with the given configuration, then the violations it finds are compared to the expected ones.</p>
<h3id="adding-tests">Adding tests</h3>
<p>Tests can be added in one of four ways:</p>
<ul>
<li><strong>From an XML file:</strong> if you already have a test XML file for your tests, you can load all the tests it defines easily.</li>
<p><strong>From the current source:</strong> A new test case with a default configuration is created, with the source that is currently in the editor</p>
</li>
<li>
<p><strong>With an empty source:</strong> A new test case with a default configuration is created, with an empty source file. You must edit the source yourself then.</p>
</li>
<li>
<p><strong>From an existing test case:</strong> Each test case list item has a “Copy” button which duplicates the test and loads the new one.</p>
</li>
</ul>
<h3id="test-status">Test status</h3>
<p>In the designer, the test panel is a list of test cases. Their status (passing, failing, error, unknown) is color coded.</p>
<details><summary>Test status color coding examples</summary>
<h3id="loading-a-test-case">Loading a test case</h3>
<p>Each test has a piece of source, which you can edit independently of the others, when the test is <strong>loaded in the editor</strong>. Additional rule configuration options can be chosen when the test is loaded.</p>
<p>Loading is done with the <strong>Load</strong> button:</p>
<p>Only one test case may be loaded at a time. If the loaded test is unloaded, the editor reverts back to the state it had before the first test case was loaded.</p>
<h3id="editing-a-loaded-test-case">Editing a loaded test case</h3>
<p>When a test is loaded, <em>the source you edit in the code area is the source of the test</em>. Changes are independent from other tests, and from the piece of source that was previously in the editor.</p>
<p>When a test is loaded, an additional toolbar shows up at the top of the code area:</p>
<p>The <strong>“Expected violations”</strong> button is used to add or edit the expected violations.</p>
<p>Initially the list of violations is empty. You can add violations by <strong>dragging and dropping nodes</strong> onto the button or its popup, from any control that displays nodes. For example:</p>
<details><summary>Adding a violation demo</summary>
<p>This configuration will be used when executing the test to check its status.</p>
<h3id="exporting-tests">Exporting tests</h3>
<p>When you’re done editing tests, it’s a good idea to save the test file to an XML file. Exporting is done using the <strong>“Export”</strong> button above the list of test cases:</p>
<p>Note that the exported file does not contain any information about the rule. The rule must be in a ruleset file somewhere else.</p>
<p>If you want to use PMD’s test framework to use the test file in your build, please refer to the conventions explained in <ahref="pmd_userdocs_extending_testing.html#where-to-place-the-test-code">the test framework documentation</a>.</p>
