xPath issue in NightwatchJS
<p>I am trying to test a command I created in NightwatchJS but I keep getting errors related to the selectors. The error is "expected 'visible' but got: 'not found'". This seems to be related to the second selector's xPath not being correct. 
<a href="https://i.stack.imgur.com/fExbd.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fExbd.png" alt="enter image description here"></a>
The selector functions utilize the xPath and test the element using the Nightwatch method <code>.waitForElementVisible</code>. I created a common command (that is basically just a selector) outside of the command I am working in that successfully selects the element using a filename as an argument. The problem is the second selector (shoeboxDropdown), which takes the first selector(shoeboxSelectButton) and adds a /div. The shoeboxDropdown selector must be related to the shoeboxSelectButton. What I want to do is select the button and then click the dropdown menu for that button. If you look at the xPaths, you may see my delima.</p>

<p>shoeboxSelectButton:</p>

<pre><code>  "//*[@id=\"sidebar-plugins\"]/div[1]/div[3]/div/div/div[2]/div[1]/ul/li/div[span/text()='" + filename + "']"
</code></pre>

<p>shoeboxDropdown:</p>

<pre><code>//*[@id="sidebar-plugins"]/div[1]/div[3]/div/div/div[2]/div[1]/ul/li/div[2]
</code></pre>

<p>They both reside under the same list item <code>li</code>, but under separate <code>divs</code>. The text for the filename lives in <code>div[1]</code>, while the dropdown menu lives in <code>div[2]</code>. How can I use the first selector to get the second using the xPath?</p>

<pre><code>shoeboxSelectButton = require "../Common/shoeboxSelectButton"

exports.command = (filename) -&gt;
    mappx = @page.mappx()

    shoeboxDropdown = () -&gt;
      shoeboxSelectButton(filename) + "/div" 
</code></pre>

<p><a href="https://i.stack.imgur.com/yD4gu.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/yD4gu.png" alt="enter image description here"></a></p>