DevTools: [Icons] do not set background-position in every UI.Icon

third_party/WebKit/Source/devtools/front_end/ui/Icon.js

 // Copyright 2016 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 /**
  * @constructor
  * @extends {HTMLSpanElement}
  */
 UI.Icon = class extends HTMLSpanElement {
   constructor() {
@@ skipping 26 matching lines @@
     this._descriptor = null;
     /** @type {string} */
     this._iconType = '';
   }
 
   /**
    * @param {string} iconType
    */
   setIconType(iconType) {
     if (this._descriptor) {
-      this.style.removeProperty('-webkit-mask-position');
-      this.style.removeProperty('background-position');
+      this.style.removeProperty('--spritesheet-position');
       this.style.removeProperty('width');
       this.style.removeProperty('height');
       this._toggleClasses(false);
       this._iconType = '';
       this._descriptor = null;
     }
     var descriptor = UI.Icon.Descriptors[iconType] || null;
     if (descriptor) {
       this._iconType = iconType;
       this._descriptor = descriptor;
-      this.style.setProperty('-webkit-mask-position', this._propertyValue());
-      this.style.setProperty('background-position', this._propertyValue());
+      this.style.setProperty('--spritesheet-position', this._propertyValue());
       this.style.setProperty('width', this._descriptor.width + 'px');
       this.style.setProperty('height', this._descriptor.height + 'px');
       this._toggleClasses(true);
     } else if (iconType) {
       throw new Error(`ERROR: failed to find icon descriptor for type: ${iconType}`);
     }
   }
 
   /**
    * @param {boolean} value
@@ skipping 154 matching lines @@
   'mediumicon-clear-storage': {x: -40, y: -0, width: 16, height: 16, spritesheet: 'resourceicons', isMask: true},
   'mediumicon-database': {x: -60, y: -0, width: 16, height: 16, spritesheet: 'resourceicons', isMask: true},
   'mediumicon-table': {x: -80, y: -0, width: 16, height: 16, spritesheet: 'resourceicons', isMask: true},
   'mediumicon-cookie': {x: -120, y: -0, width: 16, height: 16, spritesheet: 'resourceicons', isMask: true},
 
   'mediumicon-arrow-top': {x: 0, y: 0, width: 19, height: 19, spritesheet: 'arrowicons'},
   'mediumicon-arrow-bottom': {x: 0, y: -19, width: 19, height: 19, spritesheet: 'arrowicons'},
   'mediumicon-arrow-left': {x: 0, y: -38, width: 19, height: 19, spritesheet: 'arrowicons'},
   'mediumicon-arrow-right': {x: 0, y: -57, width: 19, height: 19, spritesheet: 'arrowicons'},
 };