Rimozioni e ritiri di API in Chrome 49

In quasi ogni versione di Chrome notiamo un numero significativo di aggiornamenti e miglioramenti al prodotto, alle sue prestazioni e anche alle funzionalità della piattaforma web.

In Chrome 49 (beta, 2 febbraio 2016. Data di stabilità stimata: marzo 2016) sono state apportate una serie di modifiche a Chrome

L'utilizzo del prefisso "css" in getComputedStyle(e).cssX è deprecato

TL;DR: l'uso del prefisso "css" in getComputedStyle(e) è stato deprecato poiché non faceva parte delle spec formali.

getComputedStyle è una piccola funzione eccezionale. Restituisce tutti i valori CSS degli stili dell'elemento DOM così come sono stati calcolati dal motore di rendering. Ad esempio, potresti eseguire getComputedStyle(_someElement_).height che potrebbe restituire 224,1 px perché questa è l'altezza dell'elemento così come viene visualizzato al momento.

Sembra un'API piuttosto utile. Cosa stiamo cambiando?

Prima che il motore di rendering di Chrome passasse a Blink, era basato su WebKit e consentiva di anteporre "css" all'inizio di una proprietà. Ad esempio getComputedStyle(e).cssHeight anziché getComputedStyle(e).height. Entrambi restituiranno gli stessi dati mappati agli stessi valori sottostanti, ma è questo utilizzo del prefisso "css" non standard ed è stato ritirato e rimosso.

Nota: cssFloat è una proprietà standard e non è interessata da questo ritiro.

Se accedi a una proprietà in questo modo in Chrome 49, verrà restituito undefined e dovrai correggere il codice.

L'utilizzo di initTouchEvent è deprecato

TL;DR: initTouchEvent è stato deprecato a favore di TouchEvent constructor per migliorare la conformità alle specifiche e sarà rimosso del tutto in Chrome 54.

Intent di rimozione Tracker di stato di Chrome Problema CRBug

Per molto tempo sei in grado di creare eventi di tocco sintetici in Chrome utilizzando l'API initTouchEvent; questi vengono spesso utilizzati per simulare eventi di tocco per testare o automatizzare alcune UI nel tuo sito. Abbiamo ritirato questa API in Chrome 49 e mostreremo il seguente avviso con l'intenzione di rimuoverla completamente in Chrome 53.

L'evento "TouchEvent.initTouchEvent" è deprecato e verrà rimosso nella versione M53 verso settembre 2016. Utilizza il costruttore TouchEvent.
L'evento "TouchEvent.initTouchEvent" è deprecato e verrà rimosso nella versione M53 intorno a settembre 2016. Utilizza il costruttore TouchEvent. Per maggiori dettagli, visita la pagina https://www.chromestatus.com/features/5730982598541312.

Esistono diversi motivi per cui questa modifica è positiva. Inoltre, non rientra nelle specifiche degli eventi touch. L'implementazione di initTouchEvent in Chrome non era affatto compatibile con l'API initTouchEvent di Safari ed era diversa da quella di Firefox su Android. Infine, il costruttore TouchEvent è molto più facile da usare.

È stato deciso che il nostro obiettivo è seguire le specifiche piuttosto che mantenere un'API che non sia specifica né compatibile con l'unica altra implementazione. Di conseguenza, stiamo prima ritirando e poi rimuovendo la funzione initTouchEvent e chiedendo agli sviluppatori di utilizzare il costruttore TouchEvent.

Questa API viene utilizzata sul web, ma sappiamo che viene utilizzata da un numero relativamente basso di siti, quindi non la rimuoviamo così velocemente come potremmo normalmente. Riteniamo che una parte dell'utilizzo non sia disponibile a causa di siti che non gestiscono la versione della firma di Chrome.

Le implementazioni dell'API initTouchEvent per iOS e Android/Chrome erano talmente diverse che spesso avresti un codice simile a (spesso dimenticando Firefox)

    var event = document.createEvent('TouchEvent');
    
    if(ua === 'Android') {
      event.initTouchEvent(touchItem, touchItem, touchItem, "touchstart", window,
        300, 300, 200, 200, false, false, false, false);
    } else {
      event.initTouchEvent("touchstart", false, false, window, 0, 300, 300, 200,
        200, false, false, false, false, touches, targetTouches, changedTouches, 0, 0);
    }
    
    document.body.dispatchEvent(touchEvent);

Innanzitutto, questo è un problema, perché cerca "Android" nello user agent e Chrome su Android corrisponderà e verrà ritirato. Non può essere ancora rimosso, ma perché su Android ci saranno altri WebKit e browser meno recenti basati su Blink che dovranno ancora supportare l'API precedente.

Per gestire correttamente TouchEvents sul Web, devi modificare il tuo codice per supportare Firefox, IE Edge e Chrome verificando l'esistenza di TouchEvent nell'oggetto window e se ha una "lunghezza" positiva (indicando che si tratta di un costruttore che accetta un argomento), dovresti usarla.

    if('TouchEvent' in window && TouchEvent.length > 0) {
      var touch = new Touch({
        identifier: 42,
        target: document.body,
        clientX: 200,
        clientY: 200,
        screenX: 300,
        screenY: 300,
        pageX: 200,
        pageY: 200,
        radiusX: 5,
        radiusY: 5
      });
    
      event = new TouchEvent("touchstart", {
        cancelable: true,
        bubbles: true,
        touches: [touch],
        targetTouches: [touch],
        changedTouches: [touch]
      });
    }
    else {
      event = document.createEvent('TouchEvent');
    
      if(ua === 'Android') {
        event.initTouchEvent(touchItem, touchItem, touchItem, "touchstart", window,
          300, 300, 200, 200, false, false, false, false);
      } else {
        event.initTouchEvent("touchstart", false, false, window, 0, 300, 300, 200,
          200, false, false, false, false, touches, targetTouches, 
          changedTouches, 0, 0);
      }
    }
    
    document.body.dispatchEvent(touchEvent);

Gestori di errori e successi obbligatori nei metodi RTCPeerConnection

TL;DR: i metodi WebRTC RTCPeerConnection createOffer() e createAnswer() ora richiedono un gestore degli errori oltre a un gestore del successo. In precedenza era possibile chiamare questi metodi solo con un gestore dei successi. Questo utilizzo è obsoleto.

In Chrome 49 abbiamo anche aggiunto un avviso se chiami setLocalDescription() o setRemoteDescription() senza fornire un gestore degli errori. Prevediamo di rendere obbligatorio l'argomento del gestore degli errori per questi metodi in Chrome 50.

Ciò consente di fare promesse per questi metodi, come richiesto dalle specifiche WebRTC.

Ecco un esempio tratto dalla demo di una connessione RTCPeerConnection su WebRTC (main.js, riga 126):

    function onCreateOfferSuccess(desc) {
      pc1.setLocalDescription(desc, function() {
         onSetLocalSuccess(pc1);
      }, onSetSessionDescriptionError);
      pc2.setRemoteDescription(desc, function() {
        onSetRemoteSuccess(pc2);
      }, onSetSessionDescriptionError);
      pc2.createAnswer(onCreateAnswerSuccess, onCreateSessionDescriptionError);
    }

Tieni presente che setLocalDescription() e setRemoteDescription() hanno sempre avuto un parametro per il gestore degli errori, quindi specificare semplicemente tale parametro è una modifica sicura.

In generale, per le applicazioni WebRTC di produzione consigliamo di utilizzare adapter.js, uno shim gestito dal progetto WebRTC, per isolare le app dalle modifiche alle specifiche e dalle differenze nei prefissi.

Il file Document.defaultCharset è deprecato

TL;DR: Document.defaultCharset è stato deprecato per migliorare la conformità delle specifiche.

Intent di rimozione Tracker di stato di Chrome Problema CRBug

Document.defaultCharset è una proprietà di sola lettura che restituisce la codifica dei caratteri predefinita del sistema dell'utente in base alle impostazioni regionali. Non è stato trovato utile mantenere questo valore a causa del modo in cui i browser utilizzano le informazioni sulla codifica dei caratteri nella risposta HTTP o nel meta tag incorporato nella pagina.

Utilizzando document.characterSet ottieni il primo valore specificato nell'intestazione HTTP. Se non è presente, verrà visualizzato il valore specificato nell'attributo charset dell'elemento <meta> (ad esempio, <meta charset="utf-8">). Infine, se nessuno di questi elementi è disponibile, document.characterSet corrisponderà all'impostazione di sistema dell'utente.

Gecko non ha supportato questa proprietà e non è specificata in modo pulito, pertanto verrà ritirata da Blink in Chrome 49 (beta a gennaio 2016). Il seguente avviso verrà visualizzato nella tua console fino alla rimozione della proprietà in Chrome 50:

L&#39;API &quot;Document.defaultCharset&quot; è deprecata e verrà rimossa nella versione M50 intorno ad aprile 2016.
L'API "Document.defaultCharset" è deprecata e verrà rimossa nella versione M50 intorno ad aprile 2016. Per maggiori dettagli, visita la pagina https://www.chromestatus.com/features/6217124578066432.

Ulteriori informazioni sul ragionamento per non specificarlo possono essere lette su github. https://github.com/whatwg/dom/issues/58

Funzione getStorageUpdates() rimossa

TL;DR: Navigator.getStorageUpdates() è stato rimosso in quanto non è più incluso nelle specifiche del navigatore.

Intent di rimozione Tracker di stato di Chrome Problema CRBug

Se questo è un problema per qualcuno, mi mangio il cappello. getStorageUpdates() non è stato usato quasi mai sul web, se non del tutto.

Per citare la (versione molto vecchia) della specifica HTML5:

Sembra interessante, vero? La specifica utilizza persino la parola "whence" (che per caso è l'unica istanza di origine nella specifica). A livello di specifica, c'era un StorageMutex che controllava l'accesso allo spazio di archiviazione di blocco come localStorage e i cookie e questa API avrebbe contribuito a liberare il mutex in modo che altri script non venissero bloccati da questo StorageMutex. Ma non è mai stato implementato, non è supportato in IE o Gecko e l'implementazione di WebKit (e quindi di Blink) è stata no-op.

È stata rimossa dalle specifiche per un po' di tempo ed è stata rimossa completamente da Blink (per molto tempo è stata nulla e non ha fatto nulla, anche se chiamata).

Nell'improbabile caso che tu abbia un codice che chiama navigator.getStorageUpdates(), devi verificare la presenza della funzione prima di chiamarla.

Object.observe() è deprecato

TL;DR: Object.observe() è stato deprecato in quanto non è più nel canale di standardizzazione e verrà rimosso in una release futura.

Intent di rimozione Tracker di stato di Chrome Problema CRBug

Nel novembre 2015 è stato annunciato il ritiro di Object.Observe da TC39. È stato ritirato da Chrome 49 e se provi a utilizzarlo verrà visualizzato il seguente avviso nella console:

L&#39;API &quot;Object.observe&quot; è deprecata e verrà rimossa nella versione M50 intorno ad aprile 
    2016.
Il file "Object.observe" è deprecato e verrà rimosso nella versione M50 intorno ad aprile 2016. Per maggiori dettagli, visita la pagina https://www.chromestatus.com/features/6147094632988672.

Molti sviluppatori hanno apprezzato questa API e, se l'hai sperimentata e ora stai cercando un percorso di transizione, valuta l'utilizzo di un polyfill come MaxArt2501/object-observe o una libreria di wrapping come polymer/observe-js.