JavaScript related changes in Drupal 8.4, and beyond
Exciting, modern things are coming.
This is derived from the later parts of my Using JavaScript in D8, and Intro to ES6 (new in 8.4 Core) presentation.
Drupal 8.4
- 8.4.0 released 10/4
- Release blog post
Browser Compatibility
Internet Explorer 9 and 10 are no longer supported (woo-hoo!)
IE 9 and 10 MS support ended April 2017.
Browser share:
- IE 8: 0.93%
- IE 9: 0.68%
- IE 10: 0.52%
- IE 11*: 12%
IE11 shipped with Windows 8.1 which has a EOL of January 10, 2023 :(
jQuery Updated
Versions:
- to: 3.2.1 (March ’17 — current, 84.6KB)
- from: v2.2.4 (May ’16, 99.6KB)
Correspondingly, jQueryUI and other minor libs were updated also.
V3.0 upgrade guide (June ’16) — there’s significant, and breaking changes in 3.0, although 3.1 and 3.2 were relatively minor (except for Promise handling).
JS-Related Testing
PHPUnit has a patch-level updates.
Many former WebTestBase [currently 301 via Simpletest] tests were converted to BrowserTestBase [currently 924 functional via PHPUnit]
Check the progress on the Simpletest Countdown.
REST/API
Authenticated REST API performance increased by 15% by utilizing the Dynamic Page Cache
POSTing entities can now happen at /node, /taxonomy/term and so on, instead of /entity/node, /entity/taxonomy_term. Backward compatibility maintained.
Time fields now are normalized to RFC3339 timestamps by default. Consistency: how ‘bout that?
Allow direct REST endpoint for resetting a user’s password:
- route:
user.pass.http
- path:
/user/password
- method:
POST JSON
- controller:
\Drupal\user\Controller\UserAuthenticationController::resetPassword
Other minor changes.
AirBnB JavaScript Style Guide
Airbnb JavaScript style guide [v14.1] adopted for both core and contrib!
- There’s about 8 exceptions to the style guide.
- github.com/airbnb/javascript
- Of note, React also uses this, and it has direct support for both ES6 and React
- eslint setup guide
ES6 Support for Core
ES6 aka ECMAScript 2015 aka JavaScript 6 (Jun ‘15)*
(ES7 was finalized June 2016, ES8 June 2017, and ES9 likely June 2018)
While not mentioned in the 8.4 release notes, see www.drupal.org/node/2809281
There’s no rewrite to use newer features and syntax, but there’s an effort underway to correct syntax to pass the AirBnB (ES6) linter.
ES6 Support (Kangax compatibility table):
- IE11 11%; Edge 12–15 60–95%
- FireFox 45–56 85–97%
- Chrome 53+ 97%
- Safari 10+ 99%; iOS9–11 53–99%
So if you’re not supporting IE11 or older iOS, most of ES6 is safe to use as-is for contrib.
Supporting ES6 in Core
You only need the following if maintaining core JS.
Drupal uses Babel* (for core JS only) to maintain compatibility back to the likes of IE11:
Uses scripts/js/babel-es6-build.js
via yarn run build:js
to transpile *.es6.js
files to ES5. There's also a script to "watch".
* Requires Node, and installation of dependencies — Yarn is recommended.
Looking Forward to 8.5 & Beyond
- 8.5: March 7, 2018
- 8.6: September 5, 2018
- 8.7: March, 2019
Of course, none of these these dates are guaranteed nor even the items themselves.
8.5, JavaScript Testing
As of 8.1 JavaScript testing was available via PHPUnit (with Phantom.js).
There’s a proposal to move from PHPUnit Functional JS testing to using JS based testing via Nightwatch.js
- Nightwatch.js: “Write End-to-End tests in Node.js quickly and effortlessly that run against a Selenium/WebDriver server”
8.5–8.6, Continue “API First”
“API First” will improve REST’s DX, like revisions and UUID support, etc.
Some efforts include:
- JSON API in core?
- GraphQL into core?
- OAuth 2.0 Bearer Token into core?
8.7, React? The Facts
“Drupal looking to adopt React” — Dries, 10/2/17
- Proposed during DrupalCon Vienna
- Important that this is only targeted for admin UI to improve UX
- Facebook notably switched from their version of BSD+Patents license to MIT (9/22/17)
- There’s React, React Native, React Native Web, React VR (soon AR?), and more.
- Uses React: Magento “PWA Studio”, Facebook, TYPO3, etc.
React? Notable Issue #’s
- React proposal
- Counter proposal to use Vue.js
- Response to Vue proposal
- Response to React proposal by Vue’s author
- Polymer/Web Components proposal
Comments on the React Proposal will be open until 10/23.
React? Opinion & Conjecture
“In my opinion, we still lack sufficient JavaScript expertise among Drupal core contributors.” — Dries
- I’ve heard from core devs it’s very likely React
- React lib probably will ship in admin theme, not as a core lib
- WordPress(.com) had halted their React efforts because of its prior license — presumably it’ll go forward now?
- A new React-based DB Log UI will likely arrive before year end
- On a related note, Backbone (and Underscore) could be deprecated, and then removed with D9
- I’m a bit concerned with React’s seeming indifference, if not outright contempt, with the Web Components standards.
In Closing
Lots of exciting things happening with Drupal and JavaScript.
Make the most of D8 JavaScript with my article, Loading and Using JavaScript in Drupal 8