title: Input text in iframe with puppeteer
body: <p>I am using <code>"puppeteer": "^1.20.0",</code> for testing.</p>
  
  <p>I have implemented the <a href="https://imperavi.com/redactor/" rel="nofollow noreferrer">wysiwyg editor redactor</a> as <code>iframe</code>:</p>
  
  <pre><code>&lt;div class="redactor_box"&gt;
    &lt;ul class="redactor_toolbar"&gt;
      &lt;li class="redactor_btn_group redactor_btn_right"&gt;
        &lt;ul&gt;
          &lt;li class="redactor_btn_container_switchmode"&gt;
            &lt;a href="javascript:void(null);" title="Use BB Code Editor" class="redactor_btn_switchmode" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="redactor_btn_group redactor_btn_right"&gt;
        &lt;ul&gt;
          &lt;li class="redactor_btn_container_removeformat"&gt;
            &lt;a href="javascript:void(null);" title="Remove Formatting" class="redactor_btn_removeformat" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="redactor_btn_group"&gt;
        &lt;ul&gt;
          &lt;li class="redactor_btn_container_bold"&gt;
            &lt;a href="javascript:void(null);" title="Bold (Ctrl+B)" class="redactor_btn_bold" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_italic"&gt;
            &lt;a href="javascript:void(null);" title="Italic (Ctrl+I)" class="redactor_btn_italic" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_underline"&gt;
            &lt;a href="javascript:void(null);" title="Underline (Ctrl+U)" class="redactor_btn_underline" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="redactor_btn_group"&gt;
        &lt;ul&gt;
          &lt;li class="redactor_btn_container_fontcolor"&gt;
            &lt;a href="javascript:void(null);" title="Text Color" class="redactor_btn_fontcolor" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_fontsize"&gt;
            &lt;a href="javascript:void(null);" title="Font Size" class="redactor_btn_fontsize" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_fontfamily"&gt;
            &lt;a href="javascript:void(null);" title="Font Family" class="redactor_btn_fontfamily" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="redactor_btn_group"&gt;
        &lt;ul&gt;
          &lt;li class="redactor_btn_container_createlink"&gt;
            &lt;a href="javascript:void(null);" title="Link" class="redactor_btn_createlink" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_unlink"&gt;
            &lt;a href="javascript:void(null);" title="Unlink" class="redactor_btn_unlink" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="redactor_btn_group"&gt;
        &lt;ul&gt;
          &lt;li class="redactor_btn_container_alignment"&gt;
            &lt;a href="javascript:void(null);" title="Alignment" class="redactor_btn_alignment" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="redactor_btn_group"&gt;
        &lt;ul&gt;
          &lt;li class="redactor_btn_container_unorderedlist"&gt;
            &lt;a href="javascript:void(null);" title="• Unordered List" class="redactor_btn_unorderedlist" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_orderedlist"&gt;
            &lt;a href="javascript:void(null);" title="1. Ordered List" class="redactor_btn_orderedlist" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_outdent"&gt;
            &lt;a href="javascript:void(null);" title="&lt; Outdent" class="redactor_btn_outdent" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_indent"&gt;
            &lt;a href="javascript:void(null);" title="&gt; Indent" class="redactor_btn_indent" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="redactor_btn_group"&gt;
        &lt;ul&gt;
          &lt;li class="redactor_btn_container_smilies"&gt;
            &lt;a href="javascript:void(null);" title="Smilies" class="redactor_btn_smilies" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_image"&gt;
            &lt;a href="javascript:void(null);" title="Image" class="redactor_btn_image" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_media"&gt;
            &lt;a href="javascript:void(null);" title="Media" class="redactor_btn_media" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_insert"&gt;
            &lt;a href="javascript:void(null);" title="Insert..." class="redactor_btn_insert" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="redactor_btn_group"&gt;
        &lt;ul&gt;
          &lt;li class="redactor_btn_container_draft"&gt;
            &lt;a href="javascript:void(null);" title="Drafts" class="redactor_btn_draft" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
      &lt;li class="redactor_btn_group"&gt;
        &lt;ul&gt;
          &lt;li class="redactor_btn_container_undo"&gt;
            &lt;a href="javascript:void(null);" title="Undo (Ctrl+Z)" class="redactor_btn_undo" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
          &lt;li class="redactor_btn_container_redo"&gt;
            &lt;a href="javascript:void(null);" title="Redo (Ctrl+Y)" class="redactor_btn_redo" unselectable="on" tabindex="-1"&gt;&lt;/a&gt;
          &lt;/li&gt;
        &lt;/ul&gt;
      &lt;/li&gt;
    &lt;/ul&gt;&lt;iframe style="width: 100%; height: 264px;" frameborder="0" class="redactor_textCtrl redactor_MessageEditor redactor_BbCodeWysiwygEditor redactor_NoAutoComplete"&gt;&lt;/iframe&gt;
    &lt;div class="redactor_editor_drop dragDisabled"&gt;&lt;span&gt;Uploads are not available.&lt;/span&gt;&lt;/div&gt;&lt;textarea name="message_html" id="ctrl_message_html" class="textCtrl MessageEditor BbCodeWysiwygEditor NoAutoComplete" style="height: 260px; display: none;" data-css-url="css.php?style=3&amp;amp;css=editor_contents&amp;amp;d=1589815082"
      data-dialog-url="index.php?editor/dialog&amp;amp;style=3" data-auto-save-url="conversations/save-draft" data-options="{&amp;quot;autoSaveFrequency&amp;quot;:&amp;quot;60&amp;quot;,&amp;quot;bbCodes&amp;quot;:[]}"&gt;&lt;/textarea&gt;&lt;/div&gt;
  </code></pre>
  
  <p>I am trying to use:</p>
  
  <pre><code>        const editFrame = await page.frames().find(f =&gt; f.name() === 'redactor');
          const inputb = await editFrame.$('#html'); 
  </code></pre>
  
  <p>However, the iframe does not have any name. Furthermore, how do I then input into the iframe.</p>
  
  <p>I highly appreciate your replies!</p>