Ich bin damit einverstanden, dass wir auf Funktionen testen sollten, aber es ist schwierig, eine einfache Antwort auf "Welche Funktionen werden von" modernen Browsern ", aber nicht von" alten Browsern "unterstützt?" Zu finden.
Also habe ich eine Reihe von Browsern gestartet und Modernizer direkt inspiziert. Ich habe ein paar Funktionen hinzugefügt, die ich definitiv benötige, und dann "inputtypes.color" hinzugefügt, da dies alle wichtigen Browser abzudecken scheint, die mir wichtig sind: Chrome, Firefox, Opera, Edge ... und NICHT IE11. Jetzt kann ich sanft vorschlagen, dass der Benutzer mit Chrome / Opera / Firefox / Edge besser dran wäre.
Dies ist, was ich benutze - Sie können die Liste der Dinge bearbeiten, die für Ihren speziellen Fall getestet werden sollen. Gibt false zurück, wenn eine der Funktionen fehlt.
/**
* Check browser capabilities.
*/
public CheckBrowser(): boolean
{
let tests = ["csstransforms3d", "canvas", "flexbox", "webgl", "inputtypes.color"];
// Lets see what each browser can do and compare...
//console.log("Modernizr", Modernizr);
for (let i = 0; i < tests.length; i++)
{
// if you don't test for nested properties then you can just use
// "if (!Modernizr[tests[i]])" instead
if (!ObjectUtils.GetProperty(Modernizr, tests[i]))
{
console.error("Browser Capability missing: " + tests[i]);
return false;
}
}
return true;
}
Und hier ist die GetProperty-Methode, die für "inputtypes.color" benötigt wird.
/**
* Get a property value from the target object specified by name.
*
* The property name may be a nested property, e.g. "Contact.Address.Code".
*
* Returns undefined if a property is undefined (an existing property could be null).
* If the property exists and has the value undefined then good luck with that.
*/
public static GetProperty(target: any, propertyName: string): any
{
if (!(target && propertyName))
{
return undefined;
}
var o = target;
propertyName = propertyName.replace(/\[(\w+)\]/g, ".$1");
propertyName = propertyName.replace(/^\./, "");
var a = propertyName.split(".");
while (a.length)
{
var n = a.shift();
if (n in o)
{
o = o[n];
if (o == null)
{
return undefined;
}
}
else
{
return undefined;
}
}
return o;
}