title: Assert presence of text in an html tag attribute using Puppeteer, Mocha and Chai
body: <p>I'm beginning my journey with these technologies (including Javascript), so, a beginners question.  I'm struggling to work out how to assert that the given text within an HTML attribute is as expected.  </p>
  
  <p>The HTML snippet:</p>
  
  <pre><code>&lt;input name="8hv3a" type="radio" id="email-optout-8hv3a" value="1|optin|out" data-com.user-edited="yes"&gt;
  </code></pre>
  
  <p>Here is my .it function thus far, using Mochai, Puppeteer and Chai (setup and teardown elided for clarity:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>  it('opt out of email', async function () {
  
          await page.setDefaultNavigationTimeout();
          await page.waitForSelector('.widget-title');
          const frame = page.frames().find(frame =&gt; frame.name() === 'iframe');
          const emailOptOutButton = await frame.$('#email-optout-8hv3a');
          await emailOptOutButton.click();
          const emailOptOutConfirmedValue = await frame.$('#email-optout-8hv3a', e =&gt; e.getAttribute('data-com.user-edited'))
          expect(emailOptOutConfirmedValue).to.include('yes')
  
  
      })</code></pre>
  </div>
  </div>
  </p>
  
  <p>Everything works up until the click event, but my assertion is clearly wrong.  The error is:</p>
  
  <pre><code> AssertionError: object tested must be an array, a map, an object, a set, a string, or a weakset, but object given
  </code></pre>
  
  <p>I've tried</p>
  
  <pre><code>    it('opt out of email', async function () {
  
      await page.setDefaultNavigationTimeout();
      await page.waitForSelector('.widget-title');
      const frame = page.frames().find(frame =&gt; frame.name() === 'iframe');
      const emailOptOutButton = await frame.$('#email-optout-8hv3a');
      await emailOptOutButton.click();
      await page.$eval.emailOptOutConfirmedValue.getAttribute('data-com.user-edited')
      expect(emailOptOutConfirmedValue).to.include('yes')
  
  
  })
  </code></pre>
  
  <p>Which gives:</p>
  
  <pre><code>  TypeError: Cannot read property 'getAttribute' of undefined
  </code></pre>
  
  <p>And also:</p>
  
  <pre><code> it('opt out of email', async function () {
  
      await page.setDefaultNavigationTimeout();
      await page.waitForSelector('.widget-title');
      const frame = page.frames().find(frame =&gt; frame.name() === 'iframe');
      const emailOptOutButton = await frame.$('#email-optout-8hv3a');
      await emailOptOutButton.click();
      const emailOptOutConfirmedValue = await frame.$('#email-optout-8hv3a', e =&gt; e.getAttribute('data-com.user-edited'))
      assert.equal(emailOptOutConfirmedValue, 'yes')
  
  
  })
  </code></pre>
  
  <p>Which gives:</p>
  
  <pre><code>ReferenceError: assert is not defined
  </code></pre>
  
  <p>As I said, I'm a beginner so go any help appreciated!</p>