index.ts

/**
 * vendor prefixes that being taken into consideration.
 */
export const vendors = ['webkit', 'ms', 'moz', 'o'];

/**
 * get vendor property name that contains uppercase letter.
 * e.g. webkitTransform
 * @param prop property name. for example: transform
 * @param host optional. property owner. default to `document.body.style`.
 */
export function getProperty(prop: string, host?: HTMLElement | Window | Navigator) {
  const targetHost = host || document.body.style;
  if (!(prop in targetHost)) {
    const char1 = prop.charAt(0).toUpperCase();
    const charLeft = prop.substr(1);
    for (var i = 0; i < vendors.length; i++) {
      const vendorProp = vendors[i] + char1 + charLeft;
      if (vendorProp in targetHost) {
        return vendorProp;
      }
    }
  }
  return prop;
}

/**
 * get vendor event property name omitting `on` prefix.
 * @param prop property name. for example: animationend.
 * @param host optional. property owner. default to `document.body`.
 */
export function getEventProperty(prop: string, host?: HTMLElement | Window) {
  const targetHost = host || document.body;
  if (!(('on' + prop) in targetHost)) {
    for (var i = 0; i < vendors.length; i++) {
      const vendorProp = vendors[i] + prop;
      if (('on' + vendorProp) in targetHost) {
        return vendorProp;
      }
    }
  }
  return prop;
}