Hide elements using selenium webdriver in python by executing a javascript

Question

I want to hide elements on canvas element by executing a javascript in python.

I have tried below:

    def hide_elements():
        driver = LiveLibrary.get_webdriver_instance()

        js_script = '''\
        element1 = document.getElementsByClassName('someclass');
        element1[0].style.display = 'none';
        element2 = document.getElementsByClassName('another');
        element2[0].style.display = 'none';
        element3 = document.getElementsByClassName('highlight');
        element3[0].style.display = 'none';
        element4 = document.getElementsByClassName('overlay');
        element4[0].style.display = 'none';
        '''
        driver.execute_script(js_script)

The above works but as you can see there is a repetition of code. Is there a way I can simplify this rather than finding each element and hiding them?

This would work in a browser: [...document.querySelectorAll("[class^=class]")].forEach(ele => ele.style.display = "none"); — mplungjan
– mplungjan, Commented Sep 27, 2019 at 7:51

mplungjan · Accepted Answer · 2019-09-27 09:02:05Z

5

If only one of each class - I use ES<5 to not break your webdriver:

var cls = ["someclass","another","highlight","overlay"];
for (var i=0;i<cls.length;i++) {
  document.querySelector("."+cls[i]).style.display = "none";
}

This would work in a browser:

[...document.querySelectorAll("[class^=class]")].forEach(ele => ele.style.display = "none");

For different classes:

["someclass","another","highlight","overlay"]
  .forEach(cls => [...document.querySelectorAll("."+cls)]
  .forEach(ele => ele.style.display = "none"));

For older JS versions:

["someclass","another","highlight","overlay"]
  .forEach(function(cls) { [...document.querySelectorAll("."+cls)]
  .forEach(function(ele) { ele.style.display = "none"})});

Even older:

var cls= ["someclass","another","highlight","overlay"];
for (var i=0;i<cls.length;i++) {
  var elements = document.querySelectorAll("."+cls[i]);
  for (var j=0;j<elements.length;j++) {
    elements[j].style.display = "none";
  }
}

edited Sep 27, 2019 at 9:02

answered Sep 27, 2019 at 7:57

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Ankit Agarwal Over a year ago

Why added answer when you prefer to comment and help OP

someuser2491 Over a year ago

i get this error webdriverexception: SyntaxError: Unexpected token '=>'

mplungjan Over a year ago

Yeah, I would expect the version of JS would not allow that. see update

Pritam Maske · Accepted Answer · 2019-09-27 08:05:55Z

0

use following code :

js_script = '''\
document.getElementsByClassName('someclass')[0].setAttribute("hidden","");
document.getElementsByClassName('another')[0].setAttribute("hidden","");
document.getElementsByClassName('highlight')[0].setAttribute("hidden","");
document.getElementsByClassName('overlay')[0].setAttribute("hidden","");
 '''
driver.execute_script(js_script)

edited Sep 27, 2019 at 8:05

answered Sep 27, 2019 at 8:01

Pritam Maske

2,7802 gold badges26 silver badges31 bronze badges

4 Comments

mplungjan Over a year ago

More or less same repetition, no?

Pritam Maske Over a year ago

@mplungjan : I am just trying to answer the question ..as he specifically mentioned the scripts to be executed..

Pritam Maske Over a year ago

@someuser2491 : could you please have a try at this

mplungjan Over a year ago

There is very little difference between original question and this answer. Instead of display, you set hidden and you save a line by adding the [0] to the getElementsByClassName. Not sure what is gained here DRY-wise

Collectives™ on Stack Overflow

Hide elements using selenium webdriver in python by executing a javascript

2 Answers 2

3 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related