Is there any way to list all the changes on a web page?

Question

Is there any way to list all of the changes on a web page? By changes I mean all the new html elements added to the page, old elements that removed, location of some elements changed?

I am using selenium web driver with java. This is my code:

            @Test(dataProvider = "deviceName")
        public void mobileEmulation(String deviceName, String url){

            String ChromeDriverPath = "C:\\chromedriver_win32\\chromedriver.exe";
            System.setProperty("webdriver.chrome.driver", ChromeDriverPath);
            Map<String, String> mobileEmulation = new HashMap<String, String>();
            mobileEmulation.put("deviceName", deviceName);

            Map<String, Object> chromeOptions = new HashMap<String, Object>();
            chromeOptions.put("mobileEmulation", mobileEmulation);
            DesiredCapabilities capabilities = DesiredCapabilities.chrome();
            capabilities.setCapability(ChromeOptions.CAPABILITY, chromeOptions);
            WebDriver driver = new ChromeDriver(capabilities);

            for ( int i = 0 ; i < 2 ; i ++){
                driver.get(url);
                String source=driver.getPageSource();  
            }

            driver.quit();
        }

I am stuck since I have no idea how to do it or from where to start?

If it's XHTML, try XMLUnit: http://javarevisited.blogspot.co.uk/2017/04/how-to-compare-two-xml-files-in-java.html . If it's not XHTML, there are ways to fix that: http://stackoverflow.com/questions/29087077/is-it-possible-to-convert-html-into-xhtml-with-jsoup-1-8-1 — slim, May 02 '17 at 16:56

score 0 · Answer 1 · edited May 23 '17 at 12:34

It sounds like you are trying to compare the changes from the default page compared to the mobile version of the page and see what the differences are? If that is the case pass a string of page source that is not emulated for mobile as a parameter and then compare the page source of the mobile and the default page. You can use something like this Extract the difference between two strings in Java to print out the differences between the two sources.

A better way to do this might be something like this

   public String getDefaultSource(String deviceName, String url){    
       String ChromeDriverPath = "C:\\chromedriver_win32\\chromedriver.exe";
       System.setProperty("webdriver.chrome.driver", ChromeDriverPath);
       WebDriver driver = new ChromeDriver();
       driver.get(url);
       return driver.getPageSource();
   }
   public String getMobileSource(String deviceName, String url){
         String ChromeDriverPath = "C:\\chromedriver_win32\\chromedriver.exe";
        System.setProperty("webdriver.chrome.driver", ChromeDriverPath);
        Map<String, String> mobileEmulation = new HashMap<String, String>();
        mobileEmulation.put("deviceName", deviceName);

        Map<String, Object> chromeOptions = new HashMap<String, Object>();
        chromeOptions.put("mobileEmulation", mobileEmulation);
        DesiredCapabilities capabilities = DesiredCapabilities.chrome();
        capabilities.setCapability(ChromeOptions.CAPABILITY, chromeOptions);
        WebDriver driver = new ChromeDriver(capabilities);
        driver.get(url);
        return driver.getPageSource();
    }
    public void compareSource(String defSource, String mobileSource){ 
          //You can used google's diff_match_patch library to get string differences
      }

Then you just get each of the sources and do the string compare and it should show all the differences between the two.

Is there any way to list all the changes on a web page?

1 Answers1