Methods for identifying browser rendering engines like Blink, WebKit, Gecko, Trident, and EdgeHTML from user agent strings.
Returns complete rendering engine information including name and version.
/**
* Get parsed engine
* @returns Engine details with name and version
*/
getEngine(): EngineDetails;Usage Examples:
const parser = Bowser.getParser(window.navigator.userAgent);
const engine = parser.getEngine();
console.log(engine);
// { name: "Blink", version: "91.0.4472.124" }
console.log(engine.name); // "Blink"
console.log(engine.version); // "91.0.4472.124"Returns the rendering engine name with optional case conversion.
/**
* Get parsed engine's name
* @param toLowerCase - Return lower-cased value
* @returns Engine's name or an empty string
*/
getEngineName(toLowerCase?: boolean): string;Usage Examples:
const parser = Bowser.getParser(window.navigator.userAgent);
console.log(parser.getEngineName()); // "Blink"
console.log(parser.getEngineName(true)); // "blink"
console.log(parser.getEngineName(false)); // "Blink"
// Handle unknown engines
const unknownParser = Bowser.getParser("Unknown/1.0");
console.log(unknownParser.getEngineName()); // ""Checks if the current rendering engine matches a specific engine name.
/**
* Check if the engine name equals the passed string
* @param engineName - The string to compare with the engine name
* @returns Boolean indicating if the engine matches
*/
isEngine(engineName: string): boolean;Usage Examples:
const parser = Bowser.getParser(window.navigator.userAgent);
// Basic engine checking (case-insensitive)
console.log(parser.isEngine("Blink")); // true (if Blink)
console.log(parser.isEngine("blink")); // true (case-insensitive)
console.log(parser.isEngine("WebKit")); // false (if Blink)
// Conditional logic for engine-specific features
if (parser.isEngine("Blink")) {
console.log("Chromium-based browser");
// Use Blink-specific optimizations
} else if (parser.isEngine("WebKit")) {
console.log("WebKit-based browser");
// Use WebKit-specific optimizations
} else if (parser.isEngine("Gecko")) {
console.log("Mozilla-based browser");
// Use Gecko-specific optimizations
}Explicitly parses and returns rendering engine information, useful when using lazy parsing.
/**
* Get parsed engine
* @returns Engine details with name and version
*/
parseEngine(): EngineDetails;Usage Examples:
// With lazy parsing
const parser = Bowser.getParser(window.navigator.userAgent, true);
// Force engine parsing
const engine = parser.parseEngine();
console.log(engine); // { name: "Blink", version: "91.0.4472.124" }
// Subsequent calls return cached result
const sameEngine = parser.parseEngine();
console.log(sameEngine === engine); // false (new object, same data)const parser = Bowser.getParser(window.navigator.userAgent);
// Group browsers by engine family
if (parser.isEngine("Blink")) {
console.log("Chromium-based: Chrome, Edge, Opera, Brave");
// Features available in all Blink browsers
// CSS Grid, Flexbox, modern JavaScript
} else if (parser.isEngine("WebKit")) {
console.log("WebKit-based: Safari");
// Safari-specific considerations
// Different behavior for some CSS properties
} else if (parser.isEngine("Gecko")) {
console.log("Mozilla-based: Firefox");
// Firefox-specific features and quirks
}const parser = Bowser.getParser(window.navigator.userAgent);
function getCSSPrefix(parser) {
if (parser.isEngine("WebKit") || parser.isEngine("Blink")) {
return "-webkit-";
} else if (parser.isEngine("Gecko")) {
return "-moz-";
} else if (parser.isEngine("Trident") || parser.isEngine("EdgeHTML")) {
return "-ms-";
}
return "";
}
const prefix = getCSSPrefix(parser);
console.log(`CSS prefix: ${prefix}`); // "-webkit-", "-moz-", "-ms-", or ""
// Apply vendor-prefixed CSS
const element = document.getElementById("animated-element");
element.style[`${prefix}transform`] = "rotate(45deg)";const parser = Bowser.getParser(window.navigator.userAgent);
const engine = parser.getEngine();
if (parser.isEngine("Blink") && engine.version) {
const majorVersion = parseInt(engine.version.split('.')[0]);
if (majorVersion >= 80) {
console.log("Modern Blink version - full feature support");
// Use latest web standards
} else if (majorVersion >= 60) {
console.log("Older Blink version - some features may need polyfills");
// Provide fallbacks for newer features
}
}const parser = Bowser.getParser(window.navigator.userAgent);
// Test for specific web standard support based on engine
function supportsModernCSS(parser) {
if (parser.isEngine("Blink")) {
// Blink has excellent CSS support
return true;
} else if (parser.isEngine("WebKit")) {
// WebKit has good CSS support but may lag behind
return true;
} else if (parser.isEngine("Gecko")) {
// Firefox has excellent standards support
return true;
} else if (parser.isEngine("Trident")) {
// Internet Explorer has limited CSS support
return false;
}
return false;
}
if (supportsModernCSS(parser)) {
document.body.classList.add('modern-css');
} else {
document.body.classList.add('legacy-css');
}interface EngineDetails {
name?: string;
version?: string;
}