title: Selecting a CSS element with a dynamic id
body: <p>I'm writing automated tests using cucumber and SitePrism, and I'm having trouble selecting a CSS element between tests because its id is dynamic (changes with the user id) and the name isn't unique. The element is a user role dropdown menu, hence the id changing to match the user id.</p>
  <p>The HTML for the element is...</p>
  <pre><code>&lt;dd&gt;
     &lt;select id=&quot;select-role-a02322d1-8add-4234-aeca-02d3fca2a239&quot; name=&quot;role_id&quot;&gt;
        &lt;option title=&quot;System Administrator Role&quot; value =&quot;1&quot;&gt;Administrator&lt;/option&gt;
        &lt;option title=&quot;Secure Content Viewer&quot; value=&quot;2&quot;&gt;SecureContentView&lt;/option&gt;
     &lt;/select&gt;
  &lt;/dd&gt;
  </code></pre>
  <p>When I set the element on the page model as...</p>
  <pre><code>element :role_dropdown, 'select[name=role_id]'
  </code></pre>
  <p>And execute following object/instance...</p>
  <pre><code>And(/^select the first value in the Add Role dropdown$/) do
      @page.user.role_dropdown.select(&quot;Administrator&quot;)
  end
  </code></pre>
  <p>I am returned</p>
  <pre><code>Capybara::Ambiguous: Ambiguous match, found 2 elements matching css &quot;select[name=role_id]&quot;
  from /Users/Alex/.rvm/gems/ruby-2.1.2@railstutorial_rails_4_0/gems/capybara-2.4.3/lib/capybara/node/finders.rb:38:in 
  `block in find'
  </code></pre>
  <p>So to get the test to work, I must set the element to the static id of</p>
  <pre><code>element :role_dropdown, '#select-role-8ec3f391-3871-47ff-b605-8f43aa40677d'
  </code></pre>
  <p>But then the element is useless in all instances where the user with that id is not being tested.</p>
  <ol>
  <li><p>Is there any way to set up the element on the page model to have for a dynamic id?</p>
  </li>
  <li><p>In the instance below (figure 1), how can I go about selecting the value of 1 instead of the option's text? I would like the make what's being selected pertain to the value, not text. This way if the title or text of option 1 changes, option 1 will still be selected and the test won't fail.</p>
  </li>
  </ol>
  <p><strong>Figure 1:</strong></p>
  <pre><code>And(/^select the first value in the Add Role dropdown$/) do
      @page.user.role_dropdown.select(&quot;Administrator&quot;)
  end
  </code></pre>
  <ol start="3">
  <li>If the id is dynamic, how do I go about defining {id}? Can I define it using a key placed in environment_keys.yaml?</li>
  </ol>