Chromium Blog: Chrome 68 Beta: add to home screen, payment handler, page lifecycle

Chromium Blog

News and developments from the open source browser project

Chrome 68 Beta: add to home screen, payment handler, page lifecycle

Thursday, June 7, 2018

h1, h2, h3, h4 { margin-top: .7em; } ChromeStatus.com
New add to home screen behavior for progressive web apps

Add to home screen dialog

add to home screen criteriabeforeinstallpromptprompt()beforeinstallpromptbeforeinstallpromptprompt()let installPromptEvent; window.addEventListener('beforeinstallprompt', (event) => { // Prevent Chrome <= 67 from automatically showing the prompt event.preventDefault(); // Stash the event so it can be triggered later. installPromptEvent = event; // Update UI notify the user they can add to home screen document.querySelector('#install-button').disabled = false; }); beforeinstallprompteventmini-infobaradd to home screen criteria

Add to home screen mini infobar

Changes to add home screen behavior Payment Handler APIThe Payment Request APIPayment Handler APIweb-based payment appsconst request = new PaymentRequest([{ // Your custom payment method identifier comes here supportedMethods: 'https://bobpay.xyz/pay' }], { total: { label: 'total', amount: { value: '10', currency: 'USD' } } });

Making a payment through the Payment Request API. "Pay with BobPay" is a custom payment method built with the Payment Handler API.

Protecting users from unwanted destinations Require user gesture for redirects in cross-origin iframessandboxiframewill require a user gesture to navigatedemo behind this link Block tab-under navigationsandChrome will prevent these The Page Lifecycle APIfreezeresumedocument.wasDiscardedfreezechrome://discardsspecificationexplainer on GitHub Other features in this release CSS Accept two values in the overflow shorthand overflowwill accept two valuesoverflow-xoverflow-y CSS position values with three partsobject-positionperspective-originwill no longer accept three-part values"top right 20%" Support 'x' as a resolution unitCSS Values and Units Module Level 4'x''dppx' Unprefix CSS "grab" and "grabbing" values for cursor propertyChrome will support Gamepads High resolution timestamp for GamepadGamepad.timestampDOMHighResTimeStampPerformanceTiming.navigationStart Custom elements New customElements.upgrade()innerHTMLallows developers to fully control the timing Input Keyboard lockthis APICmd-TabAlt-TabEscEsc Make PointerEvent.fromElement and PointerEvent.toElement nullPointerEventsfromElementtoElementPointer Events Level 2 always reporting nullMouseEventPointerEventfromElementtoElementtargetrelatedTarget Unified touch adjustmentTouch adjustmentTouchEventPointerEventTouchEvent Treat long-press as a user gestureconsidered a user gesturenavigator.vibrate() Media WebAudio: add user selectable automation rate for AudioParamsAudioParam.automationRateAudioParam"a-rate" or "k-rate"AudioParamBiquadFilterNode ServiceWorker Improve cache management for service worker scriptsHTTP cache will be ignoredimportScriptsServiceWorkerRegistration.updateViaCache WebRTC RTCRtpSender.getParameters()/setParameters() return and control track encoding

The getParameters() and setParameters() methods return or update the RTCRtpSender object's current parameters for how the RTCRtpSender.track property is encoded and transmitted to a remote RTCRtpReceiver. These methods enable you to change encoding parameters for WebRTC streams such as the maximum transmission bitrate without doing any SDP munging or renegotiation.

Deprecations and interoperability improvements Deprecate and remove negative brightness values in filterbrightness()no longer accepts negative values Remove document.createTouchdocument.createTouch()is being removedTouch() Remove Document.selectedStylesheetSet and Document.preferredStylesheetSetDocument.selectedStylesheetSetDocument.preferredStylesheetSetremoved because they are non-standard WEBGL_compressed_texture_atcSupport for it has been removed