حذف و حذف API در Chrome 49

پل کینلان

صفحه اصلی توییتر GitHub Glitch Mastodon

تقریباً در هر نسخه کروم شاهد تعداد قابل توجهی به روز رسانی و بهبود محصول، عملکرد آن و همچنین قابلیت های پلت فرم وب هستیم.

در Chrome 49 (بتا 2 فوریه 2016. تاریخ پایدار تخمینی: مارس 2016) تعدادی تغییر در Chrome وجود دارد

استفاده از پیشوند "css" در getComputedStyle(e).cssX منسوخ شده است.

TL;DR : استفاده از پیشوند "css" در getComputedStyle(e) منسوخ شده است زیرا بخشی از مشخصات رسمی نبود.

• قصد حذف
• ردیاب Chromestatus
• مسئله CRBug

getComputedStyle یک تابع کوچک عالی است. تمام مقادیر CSS سبک های عنصر DOM را همانطور که توسط موتور رندر محاسبه شده است، برمی گرداند. بنابراین، برای مثال، می‌توانید getComputedStyle(_someElement_).height اجرا کنید و ممکن است 224.1px را برگردانید، زیرا این ارتفاع عنصر است که در حال حاضر نمایش داده می‌شود.

به نظر یک API بسیار مفید است. پس چه چیزی را تغییر می دهیم؟

قبل از اینکه موتور رندر کروم به Blink تغییر کند، از WebKit پشتیبانی می‌کرد و به شما اجازه می‌داد تا پیشوند «css» را برای شروع یک ویژگی قرار دهید. برای مثال getComputedStyle(e).cssHeight به جای getComputedStyle(e).height . هر دو همان داده‌هایی را که نگاشت شده‌اند به مقادیر زیرین یکسان برمی‌گردانند، اما این استفاده از پیشوند "css" است که غیراستاندارد است و منسوخ و حذف شده است.

توجه - cssFloat یک ویژگی استاندارد است و تحت تأثیر این منسوخ شدن قرار نمی گیرد.

اگر به یک ویژگی در کروم 49 از این طریق دسترسی داشته باشید، undefined باز می گردد و باید کد خود را اصلاح کنید.

استفاده از initTouchEvent منسوخ شده است

TL;DR : initTouchEvent به نفع constructor TouchEvent منسوخ شده است تا انطباق با مشخصات را بهبود بخشد و به طور کلی در Chrome 54 حذف خواهد شد.

قصد حذف مشکل CRBug ردیاب Chromestatus

برای مدت طولانی می‌توانید با استفاده از initTouchEvent API رویدادهای لمسی مصنوعی را در Chrome ایجاد کنید، اینها اغلب برای شبیه‌سازی رویدادهای لمسی برای آزمایش یا خودکار کردن برخی از رابط‌های کاربری در سایت شما استفاده می‌شوند. در Chrome 49 ما این API را منسوخ کرده‌ایم و اخطار زیر را با هدف حذف کامل آن در Chrome 53 نشان خواهیم داد.

چند دلیل وجود دارد که چرا این تغییر خوب است . همچنین در مشخصات Touch Events نیست. پیاده‌سازی Chrome از initTouchEvent به هیچ وجه با API initTouchEvent Safari سازگار نبود و با Firefox در اندروید متفاوت بود. و در نهایت، استفاده از سازنده TouchEvent بسیار ساده تر است.

تصمیم گرفته شد که ما به جای حفظ یک API که نه مشخص است و نه با تنها پیاده سازی دیگر سازگار است، از مشخصات پیروی کنیم. در نتیجه ما ابتدا تابع initTouchEvent را منسوخ و سپس حذف می کنیم و از توسعه دهندگان می خواهیم که از سازنده TouchEvent استفاده کنند.

از این API در وب استفاده می‌شود ، اما می‌دانیم که تعداد نسبتاً کمی از سایت‌ها از آن استفاده می‌کنند، بنابراین ما آن را به سرعت معمول حذف نمی‌کنیم. ما معتقدیم که برخی از استفاده‌ها به دلیل عدم استفاده از نسخه امضای کروم توسط سایت‌ها شکسته شده است.

از آنجایی که پیاده‌سازی‌های iOS و Android/Chrome در initTouchEvent API بسیار متفاوت بودند، اغلب کدهایی در امتداد خطوط (که اغلب فایرفاکس را فراموش می‌کنید) دارید.

    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);

اولاً، این بد است زیرا به دنبال «Android» در User-Agent می‌گردد و Chrome در Android مطابقت دارد و به این منسوخ شدن ضربه می‌زند. البته هنوز نمی‌توان آن را حذف کرد، زیرا برای مدتی دیگر مرورگرهای WebKit و Blink قدیمی‌تر در اندروید وجود خواهند داشت که همچنان باید از API قدیمی‌تر پشتیبانی کنید.

برای مدیریت صحیح TouchEvents در وب، باید کد خود را برای پشتیبانی از فایرفاکس، IE Edge، و Chrome با بررسی وجود TouchEvent در شی window و اینکه آیا دارای "طول" مثبت است تغییر دهید (که نشان می دهد سازنده ای است که آرگومان می گیرد. ) باید از آن استفاده کنید.

    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);

کنترل‌کننده‌های خطا و موفقیت در روش‌های RTCPeerConnection مورد نیاز است

TL;DR: متدهای WebRTC RTCPeerConnection createOffer() و createAnswer() اکنون به یک کنترل کننده خطا و همچنین یک کنترل کننده موفقیت نیاز دارند. پیش از این، فراخوانی این روش ها تنها با یک کنترل کننده موفقیت امکان پذیر بود. این استفاده منسوخ شده است.

در Chrome 49، اگر شما setLocalDescription() یا setRemoteDescription() بدون ارائه کنترل کننده خطا فراخوانی کنید، هشداری اضافه کرده ایم. ما انتظار داریم که آرگومان کنترل کننده خطا را برای این روش ها در کروم 50 اجباری کنیم.

این بخشی از باز کردن راه برای معرفی وعده‌ها در این روش‌ها است، همانطور که توسط مشخصات WebRTC مورد نیاز است.

در اینجا یک مثال از نسخه ی نمایشی WebRTC RTCPeerConnection ( main.js، خط 126 ) آورده شده است:

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

توجه داشته باشید که هم setLocalDescription() و هم setRemoteDescription() همیشه یک پارامتر کنترل کننده خطا داشتند، بنابراین به سادگی تعیین آن پارامتر یک تغییر مطمئن است.

به طور کلی، برای برنامه‌های WebRTC تولیدی، توصیه می‌کنیم از adapter.js ، یک شیم که توسط پروژه WebRTC نگهداری می‌شود، استفاده کنید تا برنامه‌ها را از تغییرات مشخصات و تفاوت‌های پیشوندها محافظت کند.

Document.defaultCharset منسوخ شده است

TL;DR : Document.defaultCharset برای بهبود انطباق با مشخصات منسوخ شده است.

قصد حذف مشکل CRBug ردیاب Chromestatus

Document.defaultCharset یک ویژگی فقط خواندنی است که رمزگذاری کاراکترهای پیش فرض سیستم کاربر را بر اساس تنظیمات منطقه ای آنها برمی گرداند. به دلیل روشی که مرورگرها از اطلاعات رمزگذاری کاراکتر در پاسخ HTTP یا در متا تگ تعبیه شده در صفحه استفاده می کنند، حفظ این مقدار مفید نیست.

با استفاده از document.characterSet اولین مقدار مشخص شده در هدر HTTP را دریافت خواهید کرد. اگر وجود نداشته باشد، مقدار مشخص شده در ویژگی charset عنصر <meta> را دریافت خواهید کرد (به عنوان مثال، <meta charset="utf-8"> ). در نهایت اگر هیچ یک از آنها در دسترس نباشد document.characterSet تنظیمات سیستم کاربر خواهد بود.

Gecko از این ویژگی پشتیبانی نکرده است و به طور دقیق مشخص نشده است، بنابراین این ویژگی از Blink در Chrome 49 (بتا در ژانویه 2016) منسوخ خواهد شد. تا زمانی که این ویژگی در Chrome 50 حذف نشود، هشدار زیر در کنسول شما ظاهر می شود:

بحث بیشتر در مورد دلیل عدم تعیین این موضوع را می توانید در github بخوانید https://github.com/whatwg/dom/issues/58

getStorageUpdates() حذف شد

TL;DR : Navigator.getStorageUpdates() حذف شده است زیرا دیگر در مشخصات Navigator نیست.

قصد حذف مشکل CRBug ردیاب Chromestatus

اگر این روی کسی تاثیر بگذارد من کلاهم را خواهم خورد. getStorageUpdates() به ندرت (اگر اصلا) در وب استفاده نشده است.

برای نقل قول (نسخه بسیار قدیمی) مشخصات HTML5:

خیلی جالب به نظر می رسد درست است؟ مشخصات حتی از کلمه "whence" استفاده می کند (که به طور اتفاقی تنها نمونه از کجا در مشخصات است). در سطح مشخصات، یک StorageMutex وجود داشت که دسترسی به ذخیره‌سازی مسدودکننده مانند localStorage و کوکی‌ها را کنترل می‌کرد، و این API به آزادسازی آن mutex کمک می‌کرد تا اسکریپت‌های دیگر توسط این StorageMutex مسدود نشوند. اما هرگز پیاده‌سازی نشد، در IE یا Gecko پشتیبانی نمی‌شود، و پیاده‌سازی WebKit (و در نتیجه Blink) بدون عملیات بوده است.

مدت زیادی است که از مشخصات حذف شده است و به طور کامل از Blink حذف شده است (برای طولانی ترین زمان بدون عملیات بوده و حتی در صورت فراخوانی هیچ کاری انجام نمی دهد).

در صورت بعید بودن کدی که به نام navigator.getStorageUpdates() داشتید، باید قبل از فراخوانی تابع، وجود آن را بررسی کنید.

Object.observe () منسوخ شده است

TL;DR : Object.observe() منسوخ شده است زیرا دیگر در مسیر استانداردسازی قرار ندارد و در نسخه بعدی حذف خواهد شد.

قصد حذف مشکل CRBug ردیاب Chromestatus

در نوامبر 2015 اعلام شد که Object.Observe از TC39 خارج شده است . از Chrome 49 منسوخ شده است و اگر بخواهید از آن استفاده کنید، اخطار زیر را در کنسول خواهید دید:

بسیاری از توسعه دهندگان این API را دوست داشتند و اگر با آن آزمایش کرده اید و اکنون به دنبال یک مسیر انتقال هستید، از یک polyfill مانند MaxArt2501/object-observe یا یک کتابخانه پوششی مانند polymer/observe-js استفاده کنید.