0

This probably applies to other UI libraries like Prime-NG and the like, but I'm using ng-lightning.

I am trying to grab the ngl-checkbox element with a querySelector in one of my unit tests.

fixture = TestBed.createComponent(Component);
fixture.debugElement.nativeElement.querySelector('ng-lightning element here?');

I tried adding an id attribute on the ngl-checkbox and also the input within the ngl-checkbox tags, but that doesn't work. Since the ng-lightning element renders into a bunch of different things, what do I need to pass into the querySelector to get that checkbox?

Another thing is how do I target the ng-lightning element in an external css file? I can't just target that element like a regular h1 tag.

Jumpman
  • 145
  • 1
  • 2
  • 11
  • What about `fixture.nativeElement.querySelector('ngl-checkbox');`? Can you post the template of the component you are trying to test? – Fabian Küng May 14 '19 at 06:58
  • Not exactly ngl-checkbox but ngl-form-checkbox since I'm using an older version of ng-lightning, but it's pretty standard. ` ` – Jumpman May 14 '19 at 15:27
  • Then you should be able to access it via `fixture.nativeElement.querySelector('ngl-form-checkbox');`. – Fabian Küng May 14 '19 at 16:03
  • It doesn't work. I'm pretty sure it's because of how ng-lightning tags renders the html page. I can do `fixture.debugElement.nativeElement.querySelector('input[formControlName=isFrozen]')` and it still wouldn't work. That line returns null. – Jumpman May 14 '19 at 16:33

0 Answers0