How to test pointer-events: none with Protractor and Jasmine? - css

Question

Under certain circumstances I am setting the css property "pointer-events:none" to avoid an element being clickable (it is a complex element which cannot be disabled one by one and which it is wrapped by a div and this div has the pointer-events to none)
So what used to be clickable and tested like that, it is not anymore.
When I try to test it I always get this:
Failed: unknown error: Element is not clickable at point (167, 407). Other element would receive the click:...
Which is expected because as the element is not clickable, the parent element gets the click.
My question is, how to test with Protractor/Jasmine an element which is not clickable by setting this property (pointer-events)?
By the way, the commonly used methods isEnabled and isDisplayed, both of them return true.
I also thought about creating a test which expected the error (although I would prefer a cleaner solution), with toThrow() or ToThrowError() but it didn't work at all.
Thanks

Answer 1

You can try special EC for this -
http://www.protractortest.org/#/api?view=ExpectedConditions.prototype.elementToBeClickable
Example:
var isClickable = protractor.ExpectedConditions.elementToBeClickable($('your element here'));
expect(isClickable()).toBeFalsy('Element expected not to be clickable');
I met the same problem - how i do assertion that i cannot click on element -
myElement.click().then(
() => {
fail("Element should not be clickable for Observer");
},
(err) => {
expect(err.message.toString()).toMatch("Element is not clickable at point");
});
Putting error callback and asserting that correct error was thrown.