<Meta title="Documentation/Standards/Browser Support"/>

# Browser Support

The number of browsers available to our users is vast, especially for those using mobile devices. Below, we have defined a rating system that helps us to specify the level of browser support we aim to achieve and to clarify what level of testing is required.

As with any browser support checklist, this list should be reviewed often and updated in-line with the browsers and devices that our users are choosing to access our platforms via.

## Priority definitions

### Priority level A – Fully supported

- Testing is required.
- All content must be available.
- Layout must comply with the creative design unless there is a technical need not to do so.
- All functionality must be available and work as required.


### Priority level B – Mostly supported

- Testing is required.
- Functionally, the user should be able to place an order (or carry out the main user objective for the relevant page/site).
- Layout does not have to look identical to creative design (i.e. degradation of appearance is acceptable).

### Priority level C – Not supported

- Testing is not required

For any browsers rated at level B & C, the user experience may actually be at a higher level.

A good example of this would be users browsing using Opera. The reason we don't "Fully Support" this browser is simply down to user metrics, not the quality of the browser. We'd actually expect most functionality to work with no real issues, although we don't officially test in this browser.

## Browser Matrices

**Last updated 19/10/2022**

---

### Desktop

<table class="o-table c-matrix not-striped" role="grid">
    <thead>
        <tr role="row">
            <th data-column="0" tabindex="0" scope="col" role="columnheader" aria-disabled="false" unselectable="on"
                aria-sort="none">Browser</th>
            <th data-column="1" tabindex="0" scope="col" role="columnheader" aria-disabled="false" unselectable="on"
                aria-sort="none">Grading</th>
        </tr>
    </thead>
    <tbody aria-live="polite" aria-relevant="all">
        <tr role="row">
            <td>Chrome, last 3 versions (MacOS & Windows)</td>
            <td class="c-matrix-gradeA">A</td>
        </tr>
        <tr role="row">
            <td>Edge, last 3 versions (Windows)</td>
            <td class="c-matrix-gradeA">A</td>
        </tr>
        <tr role="row">
            <td>Firefox, last 3 versions (MacOS & Windows)</td>
            <td class="c-matrix-gradeA">A</td>
        </tr>
        <tr role="row">
            <td>Safari (MacOS) latest</td>
            <td class="c-matrix-gradeA">A</td>
        </tr>
        <tr role="row">
            <td>Safari (MacOS), last 3 versions</td>
            <td class="c-matrix-gradeB">B</td>
        </tr>
        <tr role="row">
            <td>All other browsers &amp; versions</td>
            <td class="c-matrix-gradeC">C</td>
        </tr>
    </tbody>
</table>

### Mobile

<table class="o-table c-matrix not-striped" role="grid" resolved="">
    <thead>
        <tr role="row">
            <th data-column="0" tabindex="0" scope="col" role="columnheader" aria-disabled="false" unselectable="on"
                aria-sort="ascending">Browser</th>
            <th data-column="1" tabindex="0" scope="col" role="columnheader" aria-disabled="false" unselectable="on"
                aria-sort="none">Grading</th>
        </tr>
    </thead>
    <tbody aria-live="polite" aria-relevant="all">
        <tr role="row">
            <td>Safari (iPhone), last 3 versions</td>
            <td class="c-matrix-gradeA">A</td>
        </tr>
        <tr role="row">
            <td>Safari (iPad), last 3 versions</td>
            <td class="c-matrix-gradeA">A</td>
        </tr>
        <tr role="row">
            <td>Samsung Internet, last 3 versions</td>
            <td class="c-matrix-gradeA">A</td>
        </tr>
        <tr role="row">
            <td>Chrome (Mobile), last 3 versions</td>
            <td class="c-matrix-gradeA">A</td>
        </tr>
        <tr role="row">
            <td>All other versions</td>
            <td class="c-matrix-gradeC">C</td>
        </tr>
    </tbody>
</table>

---

### Test Device Models

To give an idea as to what devices are worth testing on, these are the current recommended device types based on our analytics.

- iPhone 5, 6, 7, 8, X, Xr, Xs, 11, 12 (& Plus and Pro models)
- iPad 3, 4 & 5, iPad Mini 2, 3, 4, 5
- Samsung Galaxy S7/8/9/10/10+/20/21
- Huawei CLT-L09 P20 Pro

