[🐛 Bug]: Arrow functions and `.contains()` crash IE11 via `isElementDisplayed()`

### Have you read the Contributing Guidelines on issues?

- [X] I have read the [Contributing Guidelines on issues](https://github.com/webdriverio/webdriverio/blob/main/CONTRIBUTING.md#reporting-new-issues).

### WebdriverIO Version

8.23.4

### Node.js Version

20.9.0

### Mode

Standalone Mode

### Which capabilities are you using?

```typescript
{
  browserName: 'internet explorer',
  browserVersion: '11.285',
  platformName: 'Windows 10'
}
```


### What happened?

Following on from https://github.com/webdriverio/webdriverio/issues/11705 I've got a few more IE11 issues

TypeScript uses `"target": "es2022"` for **./packages/webdriverio/src/scripts** so these aren't downleveled

## Arrow functions

Internet Explorer 11 has no [arrow function support](https://caniuse.com/arrow-functions)

https://github.com/webdriverio/webdriverio/blob/59d349ca847950354d02b9e548f60cc50e7871f0/packages/webdriverio/src/scripts/isElementDisplayed.ts#L134-L136

## Method `.contains()`

Internet Explorer 11 has [`.contains()` support](https://caniuse.com/mdn-api_node_contains) only for `HTMLElement` (not `Document` or other node types)

https://github.com/webdriverio/webdriverio/blob/59d349ca847950354d02b9e548f60cc50e7871f0/packages/webdriverio/src/scripts/isElementDisplayed.ts#L205-L208

### What is your expected behavior?

WebdriverIO v8 should still support IE11

### How to reproduce the bug.

See https://github.com/webdriverio/webdriverio/issues/11705 for the same steps to reproduce

### Relevant log output

```typescript
See https://github.com/webdriverio/webdriverio/issues/11705 for log output
```


### Code of Conduct

- [X] I agree to follow this project's Code of Conduct

### Is there an existing issue for this?

- [X] I have searched the existing issues

	// This is a partial reimplementation of Selenium's "element is displayed" algorithm.
	// When the W3C specification's algorithm stabilizes, we should implement that.
	// If this command is misdirected to the wrong document (and is NOT inside a shadow root), treat it as not shown.
	if (!isElementInsideShadowRoot(element) && !document.contains(element)) {

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

[🐛 Bug]: Arrow functions and `.contains()` crash IE11 via `isElementDisplayed()` #11711

Have you read the Contributing Guidelines on issues?

WebdriverIO Version

Node.js Version

Mode

Which capabilities are you using?

What happened?

Arrow functions

Method `.contains()`

What is your expected behavior?

How to reproduce the bug.

Relevant log output

Code of Conduct

Is there an existing issue for this?

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

	// If the container's overflow is not hidden and it has zero size, consider the
	// container to have non-zero dimensions if a child node has non-zero dimensions.
	return Array.from(element.childNodes).some((childNode: Element) => {

Uh oh!

[🐛 Bug]: Arrow functions and .contains() crash IE11 via isElementDisplayed() #11711

Description

Have you read the Contributing Guidelines on issues?

WebdriverIO Version

Node.js Version

Mode

Which capabilities are you using?

What happened?

Arrow functions

Method .contains()

What is your expected behavior?

How to reproduce the bug.

Relevant log output

Code of Conduct

Is there an existing issue for this?

Metadata

Metadata

Assignees

Labels

Type

Projects

Milestone

Relationships

Development

Issue actions

[🐛 Bug]: Arrow functions and `.contains()` crash IE11 via `isElementDisplayed()` #11711

Method `.contains()`