Selenium-Frame - Notes By ShariqSP

iFrames Examples

Understanding iframes in Web Pages

An iframe, short for "inline frame," is an HTML element used to embed another HTML document within the current document. It allows you to display content from another source (such as another webpage) within the current webpage.

Why do we use iframes?

There are several reasons why iframes are used in webpages:

  1. Embedding External Content: iframes are commonly used to embed content from external sources, such as videos from YouTube, maps from Google Maps, or social media widgets like Twitter feeds, into a webpage.
  2. Modularization: iframes allow developers to modularize their web content. By isolating certain parts of a webpage into iframes, developers can maintain separate codebases for different sections of the webpage, making it easier to manage and update the content.
  3. Security: iframes can be used to improve security by sandboxing external content. Sandboxing restricts the functionality of embedded content, preventing it from accessing the parent webpage's DOM (Document Object Model) and potentially causing security vulnerabilities.
  4. Integration: iframes enable seamless integration of third-party content and services into a webpage. For example, an e-commerce website might use iframes to embed a payment gateway provided by a third-party payment processor.
  5. Dynamic Content Loading: iframes can be used to load dynamic content asynchronously without reloading the entire webpage. This can improve performance and user experience by reducing page load times and allowing users to interact with content while it's being loaded.

In summary, iframes are a versatile HTML element used to embed external content, modularize webpages, enhance security, integrate third-party services, and load dynamic content efficiently.

Login and Registration Frames

Login Form Frame

Registration Form Frame

Frames and IFrames

Frames are a now deprecated means of building a site layout from multiple documents on the same domain. You are unlikely to work with them unless you are working with an pre HTML5 webapp. Iframes allow the insertion of a document from an entirely different domain, and are still commonly used.

public static void main(String[] args) throws InterruptedException {
        System.setProperty("webdriver.chrome.driver", "./drivers/chromedriver.exe");
        ChromeDriver driver = new ChromeDriver();
        driver.manage().window().maximize();
        driver.manage().timeouts().implicitlyWait(20, TimeUnit.SECONDS);
    
        
// Open local page

        driver.get("file:///C:/Users/Dell/Desktop/testing%20docs/Selenium_notes/iframe.html");
    
       
// Locate iframe and switch to it by webelement
 
        WebElement frame1 = driver.findElement(By.id("FR1"));
        driver.switchTo().frame(frame1);
        WebElement search = driver.findElement(By.xpath("//input[@value='Search']"));
        Actions act = new Actions(driver);
        act.click(search).perform();
    
       
// Locate iframe and switch to it by id
 
        driver.switchTo().frame("FR1");
        WebElement search = driver.findElement(By.xpath("//input[@value='Search']"));
        act.click(search).perform();
    
        
// Locate iframe and switch to it by name

        driver.switchTo().frame("frame2");
        WebElement search = driver.findElement(By.xpath("//a[text()='Sign Up']"));
        act.click(search).perform();
    
        
// Locate iframe and switch to it by index

        driver.switchTo().frame(1);
        WebElement search = driver.findElement(By.xpath("//a[text()='Sign Up']"));
        act.click(search).perform();
    
       
 // Locate iframe and switch to default content

        driver.switchTo().defaultContent();
        WebElement search = driver.findElement(By.xpath("//a[text()='Google']"));
        act.click(search).perform();
    
        Thread.sleep(5000);
        driver.close();
    }

Drag and Drop Using Frames


                    
// Load driver

    System.setProperty("webdriver.chrome.driver", "./drivers/chromedriver.exe");
    WebDriver driver = new ChromeDriver();
    
    
// Open dhtmlgoodies drag and drop

    driver.get("https://www.globalsqa.com/demo-site/draganddrop/");
    driver.manage().window().maximize();
    driver.manage().timeouts().implicitlyWait(20, TimeUnit.SECONDS);
    
    
// Switch to iframe

    WebElement frame1 = driver.findElement(By.xpath("//iframe[@class='demo-frame lazyloaded'] "));
    driver.switchTo().frame(frame1);
    
    
// Locate elements highTartas & trash

    WebElement highTartas = driver.findElement(By.xpath("//h5[text()='High Tatras']"));
    WebElement trash = driver.findElement(By.xpath("//div[@id='trash']"));
    
    Actions act = new Actions(driver);
    act.clickAndHold(highTartas).release(trash).perform();
    
    Thread.sleep(5000);
    driver.close();

Handling Iframes Interview Questions

  1. What is an iframe in HTML?
  2. Why do we need to handle iframes in Selenium WebDriver?
  3. How do you identify if an element is inside an iframe?
  4. What are the challenges in interacting with elements inside iframes?
  5. Explain the different methods to switch to an iframe in Selenium WebDriver.
  6. How do you switch to an iframe by index in Selenium WebDriver?
  7. How do you switch to an iframe by name or ID in Selenium WebDriver?
  8. How do you switch to an iframe by WebElement in Selenium WebDriver?
  9. What is the purpose of switching to a frame using frame element or frame index?
  10. Explain the difference between driver.switchTo().frame() and driver.switchTo().defaultContent() in Selenium WebDriver.
  11. How do you identify the number of iframes present on a web page?
  12. How do you switch back to the main/default content from an iframe in Selenium WebDriver?
  13. What happens if you try to interact with an element that is not in the current context (iframe) in Selenium WebDriver?
  14. What is a nested iframe? How do you handle nested iframes in Selenium WebDriver?
  15. How do you handle iframes with dynamic IDs or names in Selenium WebDriver?
  16. Explain the challenges in automating tests involving multiple iframes.
  17. What are the best practices for handling iframes in Selenium WebDriver?
  18. How do you handle iframes when performing actions such as click, sendKeys, or getText in Selenium WebDriver?
  19. What is the importance of synchronization when working with iframes in Selenium WebDriver?
  20. How do you handle iframes in Selenium WebDriver when using Page Object Model (POM)?

Multiple Choice Questions (MCQs)

  1. Which HTML tag is used to create an iframe?
    1. <iframe>
    2. <frame>
    3. <embed>
    4. <object>
  2. How do you identify an iframe element in Selenium WebDriver?
    1. Using findElement() method
    2. Using switchTo().frame() method
    3. Using switchTo().defaultContent() method
    4. Using switchTo().parentFrame() method
  3. What method is used to switch to an iframe by index in Selenium WebDriver?
    1. switchToFrame()
    2. switchTo().frame()
    3. switchToIframe()
    4. switchToIndex()
  4. Which method is used to switch back to the main/default content from an iframe in Selenium WebDriver?
    1. switchToDefaultContent()
    2. switchToMainContent()
    3. switchToParentFrame()
    4. switchToTopFrame()
  5. What happens if you try to interact with an element that is not in the current context (iframe) in Selenium WebDriver?
    1. A NoSuchElementException is thrown.
    2. A StaleElementReferenceException is thrown.
    3. A TimeoutException is thrown.
    4. No action is performed, and the script continues execution.
  6. How do you handle nested iframes in Selenium WebDriver?
    1. Using multiple switchTo().frame() commands.
    2. Using switchTo().parentFrame() method.
    3. Using switchTo().defaultContent() method.
    4. Using switchTo().topFrame() method.
  7. What is the importance of synchronization when working with iframes in Selenium WebDriver?
    1. To ensure that the correct iframe is available before switching.
    2. To wait for elements inside iframes to become interactable.
    3. To synchronize actions between different iframes.
    4. All of the above.
  8. How do you handle iframes when using Page Object Model (POM) in Selenium WebDriver?
    1. By creating separate Page Objects for each iframe.
    2. By encapsulating iframe-related operations within Page Objects.
    3. By using switchTo().frame() directly in test scripts.
    4. By avoiding iframes altogether in Page Objects.
  9. What is the best practice for handling iframes in Selenium WebDriver?
    1. To avoid using iframes whenever possible.
    2. To always switch to iframes using their index.
    3. To switch to iframes only when necessary and switch back promptly.
    4. To use implicit waits exclusively for handling iframes.
☰