# Browser Compatibility

XCover Elements (XCE) requires modern browser features to deliver a robust web component experience. This page provides a comprehensive reference for browser compatibility requirements and supported platforms.

**Global Coverage:** 93% of worldwide browser usage is supported.

### Methodology & Sources

Browser compatibility data is derived from authoritative sources and feature-level checks:

* [**Can I use**](https://caniuse.com/) - Support tables for HTML5, CSS3, and modern web features
* [**MDN Web Docs**](https://developer.mozilla.org/) - Comprehensive browser compatibility documentation
* [**WebKit Release Notes**](https://webkit.org/) - Safari-specific feature tracking

Where possible, compatibility is determined through **feature-level checks** rather than browser versions alone. Key features monitored include:

* `fetch` API
* Custom Elements (Web Components)
* Shadow DOM
* CSS Nesting
* ES2022+ JavaScript features

### Required Browser Features

XCover Elements depends on the following modern web platform features:

| Feature                                     | Usage in XCE                                                             | Browsers Lacking Support                                          |
| ------------------------------------------- | ------------------------------------------------------------------------ | ----------------------------------------------------------------- |
| **Custom Elements & Shadow DOM**            | Core architecture for encapsulated UI components and custom elements     | IE (all versions), Opera Mini, older Android browsers, UC Browser |
| **CSS Nesting**                             | CSS Modules with nested selectors for concise, modular component styling | Safari < 17, older Firefox versions, legacy mobile browsers       |
| **Numeric Separators & Logical Assignment** | Cleaner numeric literals and compact syntax (ES2022)                     | Browsers without ES2022 support                                   |
| **Optional Chaining & Nullish Coalescing**  | Helper functions and optional prop handling (ES2020)                     | Very old browsers pre-ES2020                                      |
| **CSS Container Queries**                   | Responsive component behavior without media query boilerplate            | Not fully supported in older browsers                             |
| **ES Modules Dynamic Import**               | Code splitting and lazy loading for optimized bundle sizes               | IE, legacy browsers                                               |

### Supported Browsers

#### Desktop Browsers

| Browser                | Minimum Version | Release Date   | Notes                   |
| ---------------------- | --------------- | -------------- | ----------------------- |
| **Chrome**             | 120+            | November 2023  | **Recommended browser** |
| **Mozilla Firefox**    | 117+            | August 2023    | Full feature support    |
| **Safari**             | 17+             | September 2023 | macOS and iOS           |
| **Microsoft Edge**     | 120+            | November 2023  | Chromium-based          |
| **Opera**              | 106+            | November 2023  | Chromium-based          |
| **Brave**              | 1.61+           | November 2023  | Chromium-based          |
| **Vivaldi**            | Chromium 120+   | 2023+          | Chromium-based          |
| **Arc Browser**        | Chromium 120+   | 2023+          | Chromium-based          |
| **DuckDuckGo Browser** | Chromium 120+   | 2023           | Chromium-based          |
| **Yandex Browser**     | Chromium 120+   | 2023+          | Chromium-based          |
| **SRWare Iron**        | Chromium 120+   | 2023+          | Chromium-based          |

#### Regional & Specialized Browsers

| Browser                  | Minimum Version | Release Date | Notes                      |
| ------------------------ | --------------- | ------------ | -------------------------- |
| **ChatGPT Atlas**        | Chromium 120+   | October 2025 | Chromium-based, macOS only |
| **Samsung Internet**     | Latest stable   | -            | Chromium-based             |
| **QQ Browser** (Tencent) | Chromium 120+   | -            | Chromium-based             |
| **Baidu Browser**        | Chromium 120+   | -            | Chromium-based             |

#### Mobile Browsers

| Platform    | Browser          | Minimum Version | Support Level |
| ----------- | ---------------- | --------------- | ------------- |
| **iOS**     | Safari           | 17+             | Full          |
| **iOS**     | Chrome           | 120+            | Full          |
| **iOS**     | DuckDuckGo       | Latest          | Full          |
| **Android** | Chrome           | 120+            | Full          |
| **Android** | Firefox          | 117+            | Full          |
| **Android** | Samsung Internet | Latest          | Full          |
| **Android** | DuckDuckGo       | Latest          | Full          |

***

### Unsupported Browsers

The following browsers **do not support** XCover Elements:

| Browser               | Status         | Reason                                                   |
| --------------------- | -------------- | -------------------------------------------------------- |
| **Internet Explorer** | ❌ All versions | End of Life; lacks Web Components, modern JS/CSS support |
| **Chrome**            | ❌ < 120        | Missing ES2022 support and modern APIs                   |
| **Firefox**           | ❌ < 117        | Missing modern CSS features and JS support               |
| **Safari**            | ❌ < 17         | Missing CSS nesting support and WebKit features          |
| **Edge Legacy**       | ❌ All versions | Replaced by Chromium-based Edge                          |
| **Opera**             | ❌ < 106        | Missing ES2022 support                                   |
| **Opera Mini**        | ❌ All versions | Does not support Web Components; outdated JS engine      |
| **UC Browser**        | ❌ < 2023       | Missing Web Components, CSS nesting, ES2022 support      |
| **KaiOS Browser**     | ❌ All versions | Missing ES2022 support                                   |


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://partner-docs.covergenius.com/xcover-elements/client-integration/browser-compatibility.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
