Forum Discussion

delito's avatar
delito
Occasional Contributor
3 years ago
Solved

Getting the state of a checkbox that is not a clickable point due to CSS

Hi

 

Using Chrome and TC JavaScript I am trying to get the state of a checkbox on a screen but this screen has CSS applied to the checkbox so they have become a non clickable point like so:

 

 

 

 

 

<div _ngcontent-yjq-c790="" class="form-group row"><label _ngcontent-yjq-c790="" for="sampleRefechan" class="col-sm-6 col-form-label"> Show Refechan <app-tooltip _ngcontent-yjq-c790=""><!----></app-tooltip></label><div _ngcontent-yjq-c790="" class="col-sm-6"><input _ngcontent-yjq-c790="" type="checkbox" id="sampleRefechan" name="sampleRefechan" class="form-control with-font ng-untouched ng-pristine ng-valid"><label _ngcontent-yjq-c790="" for="sampleRefechan"></label></div></div>

 

 

 

I did notice if I deselect the values for height, width and clip in styles manually it became a clickable point and I could use that, but I'm not sure how to script this ? Or is there a better way to proceed ?

 

 

Thanks

delito

 

  • I managed to remove the classes from the screen for the CSS, that made the check boxes usable

     

     

     

     

     

    function DisableCSSClass()
    {
      let browser = Aliases.browser;
      let page = browser.pageClientApp4;
      var elements = page.FindElements('//*[@class="form-control with-font ng-untouched ng-pristine ng-valid"]').toArray();
    
      if (elements.length > 0)
      {
        for (var i = 0; i < elements.length; i++)
        {
          elements[i].className="form-control ng-untouched ng-pristine ng-valid";
        }
      }
      else
      {
        Log.Message("No element with this class found on the page.");
      }
    }

     

1 Reply

  • delito's avatar
    delito
    Occasional Contributor

    I managed to remove the classes from the screen for the CSS, that made the check boxes usable

     

     

     

     

     

    function DisableCSSClass()
    {
      let browser = Aliases.browser;
      let page = browser.pageClientApp4;
      var elements = page.FindElements('//*[@class="form-control with-font ng-untouched ng-pristine ng-valid"]').toArray();
    
      if (elements.length > 0)
      {
        for (var i = 0; i < elements.length; i++)
        {
          elements[i].className="form-control ng-untouched ng-pristine ng-valid";
        }
      }
      else
      {
        Log.Message("No element with this class found on the page.");
      }
    }