Selenium Automation Testing with Disabled JavaScript Settings — Is It Worth Your Time?

Selenium has been a pinnacle for open-source software in the industry of automated website testing. The automation testing framework is widely adopted by the testing community to help them in automating interactions with their web-application for desktops.

I have been an automation tester for couple years now, and have been fondly towards Selenium ever since I knew what it’s capable of. Recently, I was pondering about a few questions though! What would happen if I disable JavaScript and then perform automation testing with Selenium? How would a website react then? Is it even possible? Is it even required?

The only way to know the answers to these questions was to have them tested. I came up with interesting results. Which is why I am writing this article to share these results with you.

I am sure you must be intrigued to know if there is a need for testing a web application after disabling JavaScript? However, before I answer that question we need to understand what you can do as a tester with JavaScript and what you cannot!

Things You Can Do With JavaScript

• Access and modify all the content visible on the web page such as text, images, videos or any other kind of private data.
• Access the cookies sent by the webserver.
• Request other servers for data capturing.

Things You Can’t Do With JavaScript

• Accessing files stored in your local system other than those uploaded on a web page.
• Accessing data from other web pages open in other tabs or on different browsers.
• Accessing and controlling the hardware capabilities of your system.
• Accessing any kind of stuff related to extensions and plugins which have been installed.

Now that you know the purpose of JavaScript. You may be wondering about the reason for your end-user to disable JavaScript in their browsers while surfing the internet?

Why Would A User Visit Your Website With JavaScript Disabled?

Believe it or not! Some of us prefer to surf the internet with JavaScript disabled in our browsers. Why?
Well, by disabling JavaScript we aim to achieve an interrupted user-experience of a website’s content. Doing so eliminates pop-ups, advertisements, warnings, etc.
Let us take a scenario to understand this better.

Mike, a web developer, is a curious reader who wishes to keep him up-to-date on the latest technologies by reading blogs, webinars, video tutorials. Mike visited your website from the search engine and is curious to read your blog around cross-browser testing. The moment he lands on your website, he encounters a huge pop-up asking him to enroll in your newspaper. He closes the pop-up, clicks on your cross-browser testing article, and scroll further below. Now, he unintentionally clicked on sponsored content. As a result, a new tab opened which routed him somewhere he never wanted to be.

What Do You Think Mike Would Be Feeling Right Now?

Well, he may feel disappointed with the overall experience of the website. Such pop-ups are quite common to encounter on any website over the internet. This is why, Mike made sure to disable the JavaScript to ensure he doesn’t encounter more pop-ups, alerts, warnings, advertisements, etc. from your website.

The moment Mike disables JavaScript, your website collapsed entirely! The content rendered absurdly. Your website images with embedded hyperlinks to related articles broke down and started showing the links separately from image.

Looks nightmarish, isn’t it? Now, it would be impossible for you to stop users like Mike from disabling JavaScript in their browsers. I agree, there won’t be many who would be surfing the internet as Mike. Some websites are fully dependent on JavaScript which is a bad practice and fails to load any resources or makes UX downgraded when JavaScript is disabled.

It depends entirely on how well you want your business to look, more importantly to how many. As a best practice, it would be in the best interest to test your website with JavaScript disabled. The best part is that you don’t need to install any plugin or any other third party application to disable JavaScript, you have this option in your browser preferences itself. In further sections, I will show you how you can test with JavaScript disabled. Before we do that, there are some other reasons for you to consider disabling JavaScript as you test your website.

Why Testing With JavaScript Disabled Should Be A Part Of Your QA Checklist?

Increase the Testing Speed

Since the main purpose of JavaScript is to bring interactive patterns to a webpage that requires higher bandwidth to load and when you have a lower bandwidth connection, it either loads very slow or downgrades the user interaction with the website. So, testing after disabling JavaScript increases your testing speed by avoiding unnecessary JavaScript resources to load and doesn’t fail your automation testing script because of web page load failure.

As a conclusion to this, you would get your testing results in every short period without any chances of getting your test flow disturbed because of any third party resources.

Ease of Accessibility

Many end-users don’t want any kind of advertisements or pop-ups while accessing any website since this kind of stuff makes them distracted from their desirable content. So, many times these kinds of JavaScript resources are closed by the end-users while accessing a particular website. This forces a website owner to test their website after disabling JavaScript to verify that their users are getting easy accessibility to their website.

Also, keep in mind that some websites are fully dependent on JavaScript to make their UI more interactive, testing of such web applications after disabling JavaScript would not make any sense than it would be better if you go for headless browser testing.

Cross-Browser Compatibility

Common cross-browser compatibility issues for JavaScript can be noticed such as:

• Browser JavaScript Interpreter is not able to parse and execute JavaScript code.
• New JavaScript features such as ECMAScript6 / ECMAScript Next and modern Web API fails to work in older browser versions.

Handling such JavaScript issues can cause a nightmare for web developers. Hence, testers must perform cross-browser testing for verifying how their website renders without JavaScript and then the development team can proceed with the resolution of JavaScript issues. Some developers prefer progressive enhancement technique and some prefer graceful degradation techniques for cross-browser compatibility testing.

You can test your website on many online cross-browser testing tools LambdaTest, Saucelabs, Crossbrowsertesting with and without JavaScript to know how your web page renders in different scenarios.

Security

As discussed, JavaScript is an executable code of a website that gets downloaded to your system's local browser whenever we visit the website and then runs. Many advertisements visible on a webpage are the basic intent of hackers to spread malware. This kind of online ads is commonly known as malvertising and planting of zombie cookies in the user’s machine. This forces end-users who are highly concerned with security to disable the website JavaScript for further accessing.
Hence, it becomes necessary now to test a web application for such end-users who prefer accessing websites without JavaScript.

Now, we will look into the process of disabling JavaScript for website testing.

How To Disable JavaScript For Manual Testing

I will be demonstrating the process in two browsers i.e. Google Chrome and Mozilla Firefox to help you integrate the process in your cross-browser testing checklist. I would be using LambdaTest to help me access different browser without going through the trouble of installing them.

1. Google Chrome

Testing in the Chrome browser has always been a priority for testers. Here is how Google search represents itself by default. Meaning, when JavaScript is enabled.

Below are the steps that can help you disable JavaScript in Chrome:

• Launch a webpage for which you need to disable JavaScript.
• Right-click on a page and direct to Inspect Elements.
• Once you get the developer tools open, then press CTRL+SHIFT+P.
• Type “Disable JavaScript” and click on the first option that says debugger.

2. Mozilla Firefox

Similarly to Google Chrome, Here is how Google search represents itself by default with enabled JavaScript.

Follow the below steps to disabling JavaScript for website on Mozilla Firefox:

• Launch a browser and enter “about: config” in the URL address bar.
• Click on “I accept the risk!” to see the configurations.
• Enter “javascript.enabled” in the search field.
• Double click on “javascript.enabled” available entry to set the boolean value as false.

How To Disable JavaScript For Automation Testing with Selenium

Now, we get down to automation testing with Selenium. Below is the code that helps to disable JavaScript on Chrome and Firefox browser. We have used ChromeOptions and FirefoxOptions class to handle the preferences of the browser. These classes further help in setting ChromeDriver and FireFoxDriverspecific capabilities such as browser version, disabling the extension, start maximized, start headless and making browser default.

Code To Run Automation Testing with Selenium In Mozilla Firefox

package DemoAutomation;
import java.util.HashMap;
import java.util.Map;
import org.junit.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.openqa.selenium.firefox.FirefoxOptions;
public class JSdisableFirefox { //Disabling JS in Firefox     
    @Test() public void Firefox_javascript_disable() throws InterruptedException {
        System.setProperty("webdriver.firefox.driver", "C:\\geckodriver.exe");
        FirefoxOptions options = new FirefoxOptions();
        options.addPreference("javascript.enabled", false);
        WebDriver driver = new FirefoxDriver(options);
        driver.get("https://www.google.com/imghp");
        driver.findElement(By.name("q")).sendKeys("flowers");
        driver.findElement(By.className("Tg7LZd")).click();
        Thread.sleep(5000);
        driver.quit();
    }
}

Code To Run Automation Testing with Selenium In Google Chrome

package DemoAutomation;
import java.util.HashMap;
import java.util.Map;
import org.junit.Test;
import org.openqa.selenium.By;
import org.openqa.selenium.JavascriptExecutor;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.openqa.selenium.chrome.ChromeOptions;
public class JSdisableChrome { //Disabling JS in Chrome           
    @Test() public void Chrome_javascript_disable() throws InterruptedException {
        System.setProperty("webdriver.chrome.driver", "C:\\Users\\Lenovo-I7\\Desktop\\Selenium\\chromedriver.exe");
        ChromeOptions options = new ChromeOptions();
        Map < String, Object > prefs = new HashMap < String, Object > ();
        prefs.put("profile.managed_default_content_settings.javascript", 2);
        options.setExperimentalOption("prefs", prefs);
        WebDriver driver = new ChromeDriver(options);
        driver.get("https://www.google.com/imghp");
        driver.findElement(By.name("q")).sendKeys("flowers");
        driver.findElement(By.className("Tg7LZd")).click();
        Thread.sleep(5000);
        driver.quit();
    }
}

Conclusion

JavaScript has been an integral part of web development, and it helps to provide us with an eye-appealing website. However, we must test what we build. In my opinion, the results were a bit devastating from a UX point of view. Few websites that I tested turn out to be completely blank. The reason being, the website was entirely dependent on JavaScript rendering. Even if the website is partially dependent on JavaScript, it is the responsibility of the tester to test their product with and without JavaScript according to the user perspective. Not to forget browser compatibility testing with JavaScript disabled will help you ensure a robust website for a wider set of audience. You can use online cross-browser testing tools like LambdaTest, Saucelabs, CrossBrowserTesting, etc to test on 2000+ real browsers hosted by VM on the cloud.

Happy Testing!

Further Reading

Best Practices For Using Selenium for Test Automation

Top 13 Resources for Learning Selenium Automation