Easiest Way to Handle Cross Browser Testing Issues

UA

add ua to html with all of the relevant information.

use all relevant information available from UA.

const spaces = /\s+/g
const ua = useragent()

// devices
if (!ua.device.type) {
    document.documentElement.classList.add('desktop')
} else {
    document.documentElement.classList.add(...[
        ua.device.type.toLowerCase().replace(spaces, '-'),
        ua.device.vendor.toLowerCase().replace(spaces, '-'),
        ua.device.model.toLowerCase().replace(spaces, '-')
    ])
}

// render engine
if (ua.engine && ua.engine.name) {
    document.documentElement.classList.add(ua.engine.name.toLowerCase().replace(spaces, '-'))
}

// browser
const browserName = ua.browser.name.toLowerCase().replace(spaces, '-')
document.documentElement.classList.add(...[
    browserName,
    `${browserName}-${ua.browser.major}`
])