Watir - Làm việc với iframe

Watir cung cấp cú pháp dễ sử dụng để làm việc với iframe.

Cú pháp

browser.iframe(id: 'myiframe') 
// will get the reference of the iframe where we want to input details.

Để hiểu cách xử lý iframe và xác định vị trí các phần tử bên trong iframe, trong chương này, chúng ta sẽ làm việc trên một ví dụ.

Thí dụ

main.html

<html>
   <head>
      <title>Testing using Watir</title>
   </head>
   <body>
      <iframe src = "test1.html" id = "myiframe" width = "500" height = "100"></iframe>
   </body>
</html>

test1.html

<html>
   <head>
      <title>Testing UI using Watir</title>
   </head>
   
   <body>
      <script type = "text/javascript">
         function wsentered() {
            console.log("inside wsentered");
            var firstname = document.getElementById("firstname");
            
            if (firstname.value != "") {
               document.getElementById("displayfirstname").innerHTML = 
                  "The name entered is : " + firstname.value;
               
               document.getElementById("displayfirstname").style.display = "";
            }
         }
      </script>
      
      <div id = "divfirstname">
         Enter First Name : 
         <input type = "text" id = "firstname" name = "firstname" onchange = "wsentered()" />
      </div>
      <br/>
      <br/>
         <div style = "display:none;" id = "displayfirstname"></div>
   </body>
</html>

Đầu ra

Trong ví dụ trên, biểu mẫu nhập được định nghĩa bên trong iframe. Mã Watir sẽ giúp chúng tôi xác định vị trí và kiểm tra biểu mẫu được cung cấp bên dưới:

Mã Watir

require 'watir'
b = Watir::Browser.new :chrome
b.goto('http://localhost/uitesting/main.html')
t = b.iframe(id: 'myiframe').text_field
t.set 'Riya Kapoor'
b.screenshot.save 'iframetestbefore.png'
t.fire_event('onchange')
b.screenshot.save 'iframetestafter.png'

Mã Watir để định vị iframe trong url được cung cấp ở đây -