{
	"title": "Bulletin de la Web Academy no 26",
	"summary": "Sortie de Firefox 70, sortie de Chrome 78 et sortie de Node.js 13",
	"date_published": "2019-10-23",
	"authors": [
		{
			"name": "PolariTOON"
		}
	],
	"tags": [],
	"external_url": "https://polaritoon.github.io/web-academy/news/26-2019-10-23/",
	"id": "web-academy-news-no-26",
	"image": "./*.svg",
	"content_html": "<p><strong>Cet article a initialement été publié sur <em>Discord</em> avant d'être archivé ici et sur <a href=\"//polaritoon.github.io/web-academy/news/26-2019-10-23/\"><em>GitHub</em></a>.</strong></p>\n<div lang=\"fr\">\n\t<p>Pas mal de nouvelles aujourd'hui avec trois sorties importantes :</p>\n\t<ul>\n\t\t<li>\n\t\t\t<p><em>Firefox</em> est sorti hier en version <em>70</em> avec un nouveau logo et quelques nouveautés :</p>\n\t\t\t<ul>\n\t\t\t\t<li>\n\t\t\t\t\t<p>Du côté des outils de développement :</p>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Les propriétés sans effet sont désormais signalées dans le panneau des règles <em>CSS</em></p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Le <em>colorpicker</em> indique désormais le niveau d'accessibilité du contraste (enfin il paraît parce que j'ai pas ça dans ma version)</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>L'onglet d'inspection de l'accessibilité signale désormais trois types de problèmes d'accessibilité (manque de contraste, absence d'étiquette, ou inaccessibilité au clavier)</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>L'onglet <em>Network</em> permet désormais d'inspecter les <em>Web sockets</em></p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</li>\n\t\t\t\t<li>\n\t\t\t\t\t<p>Du côté du <em>JS</em> :</p>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>La proposition en stage 3 <em>Numeric separators</em> a été implémentée ; il est désormais possible d'insérer des caractères soulignés (<code>_</code>) au milieu des nombres pour les rendre plus lisibles (<code>1_000</code> au lieu de <code>1000</code> par exemple)</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Plusieurs APIs relatives à l'internationalisation ont été améliorées ; <code>BigInt.prototype.toLocaleString()</code> accepte désormais les paramètres <code>locales</code> et <code>options</code>, <code>Intl.NumberFormat.format()</code> et <code>Intl.NumberFormat.formatToParts()</code> acceptent des <em>BigInt</em> et <code>Intl.RelativeTimeFormat.formatToParts()</code> a été ajoutée</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>La navigation induite par les méthodes <code>History.back()</code>, <code>History.forward()</code> et <code>History.go()</code> est désormais asynchrone</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Les méthodes <code>getTransform()</code> et <code>setTransform()</code> ont été ajoutées aux contextes 2D des éléments <code>&lt;canvas&gt;&lt;/canvas&gt;</code> pour obtenir et saisir directement les transformations absolues sous forme de matrices</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Les événements <code>&quot;ontouchstart&quot;</code> et <code>&quot;ontouchmove&quot;</code> sont désormais passifs, comme dans <em>Chrome</em> (ça avait cassé mes sites d'ailleurs à l'époque où <em>Chrome</em> avait ajouté ça sans tester)</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</li>\n\t\t\t\t<li>\n\t\t\t\t\t<p>Du côté des <em>CSS</em> :</p>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Pour les amateurs de typographie, les propriétés <code>text-decoration-thickness</code>, <code>text-underline-offset</code> et <code>text-decoration-skip-ink</code> ont été ajoutées ; sans même les utiliser explicitement, vous pourrez constater que le jambage des lettres n'est par défaut plus traversé par la barre de soulignage</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Vous croyiez que la propriété <code>display</code> ne prenait qu'un seul mot-clé ? désormais ce n'est plus le cas ; <em>Firefox</em> introduit la possibilité de spécifier indépendamment le comportement interne et externe de la boîte d'un élément ; certains mots-clés historiques deviennent des alias pour la syntaxe à deux (voire trois) mots-clés (<code>block</code> devient synonyme de <code>block flow</code>, <code>inline</code> devient synonyme de <code>inline flow</code>, <code>inline-block</code> devient synonyme de <code>inline flow-root</code>...) mais la valeur <code>run-in</code> n'est toujours pas supportée malheureusement</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Bonne nouvelle pour ceux qui utilisent les grilles <em>CSS</em> ; les propriétés <code>grid-auto-columns</code> et <code>grid-auto-rows</code> acceptent désormais plusieurs pistes, ce qui permet de réaliser certains <em>designs</em> qui n'étaient pas possibles avant (mais attendez, <code>subgrid</code> arrive dans la prochaine version !)</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>La propriété <code>font-size</code> accepte désormais la valeur <code>xxx-large</code> pour des raisons de compatibilité (sans commentaire)</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>La propriété <code>quotes</code> accepte désormais la valeur <code>auto</code> qui constitue sa nouvelle valeur initiale</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>L'opacité peut désormais être spécifiée comme un pourcentage et plus seulement un nombre dans différentes propriétés (<code>opacity</code>, <code>stop-opacity</code>, <code>flood-opacity</code>, <code>fill-opacity</code>, <code>stroke-opacity</code>, <code>-moz-window-opacity</code>, <code>shape-image-threshold</code>...)</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</li>\n\t\t\t\t<li>\n\t\t\t\t\t<p>Pour plus d'informations, consultez les pages <a href=\"https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/70,\">https://developer.mozilla.org/en-US/docs/Mozilla/Firefox/Releases/70,</a> <a href=\"https://hacks.mozilla.org/2019/10/firefox-70-a-bountiful-release-for-all/\">https://hacks.mozilla.org/2019/10/firefox-70-a-bountiful-release-for-all/</a> et <a href=\"https://www.fxsitecompat.dev/en-CA/versions/70/\">https://www.fxsitecompat.dev/en-CA/versions/70/</a></p>\n\t\t\t\t</li>\n\t\t\t</ul>\n\t\t</li>\n\t\t<li>\n\t\t\t<p><em>Chrome</em> est arrivé en version <em>78</em> hier également avec les changements suivants :</p>\n\t\t\t<ul>\n\t\t\t\t<li>\n\t\t\t\t\t<p>Du côté des <em>CSS</em> :</p>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>L'opacité peut également être spécifiée via un pourcentage</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Connaissez-vous <em>Houdini</em> ? c'est un ensemble d'APIs en développement dont le but est de permettre au développeur de contrôler directement le moteur de rendu du navigateur ; dans ce cadre et dans cette version de <em>Chrome</em>, il est désormais possible de spécifier ses propres propriétés <em>CSS</em> (nom, syntaxe, héritage, valeur initiale...) grâce à la méthode <code>CSS.registerProperty()</code> (si vous voulez voir le potentiel d'<em>Houdini</em>, consultez les pages <a href=\"https://developers.google.com/web/updates/2016/05/houdini\">https://developers.google.com/web/updates/2016/05/houdini</a> et <a href=\"https://ishoudinireadyyet.com/\">https://ishoudinireadyyet.com/</a> )</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</li>\n\t\t\t\t<li>\n\t\t\t\t\t<p>Du côté du <em>JS</em> :</p>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Un certain nombre de fonctionnalités sont désormais disponibles derrière un <em>flag</em> ou en tant qu'<em>origin trial</em> : la proposition en stage 3 <em>Optional Chaining</em> qui apporte les nouveaux opérateurs <code>?.</code>, <code>?.(...)</code> et <code>?.[...]</code> ; l'API <em>SMS Receiver</em> ou l'API <em>Native File System</em> par exemple</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</li>\n\t\t\t\t<li>\n\t\t\t\t\t<p>Pour plus d'informations, consultez les pages <a href=\"https://developers.google.com/web/updates/2019/10/nic78,\">https://developers.google.com/web/updates/2019/10/nic78,</a> <a href=\"https://developers.google.com/web/updates/2019/09/devtools\">https://developers.google.com/web/updates/2019/09/devtools</a> et <a href=\"https://v8.dev/blog/v8-release-78\">https://v8.dev/blog/v8-release-78</a></p>\n\t\t\t\t</li>\n\t\t\t</ul>\n\t\t</li>\n\t\t<li>\n\t\t\t<p>Un nouveau cycle de développement démarre pour <em>Node.js</em> :</p>\n\t\t\t<ul>\n\t\t\t\t<li>\n\t\t\t\t\t<p><em>Node.js 12.13</em> &quot;Erbium&quot; constitue depuis lundi la nouvelle version à support étendu (LTS) et devient donc la version recommandée pour développer sous <em>Node.js</em></p>\n\t\t\t\t</li>\n\t\t\t\t<li>\n\t\t\t\t\t<p>La version <em>13</em> est sortie hier :</p>\n\t\t\t\t\t<ul>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>De nombreuses locales sont désormais disponibles et plus seulement l'anglais ce qui rend enfin utiles les APIs d'internationalisation (l'espace de noms <code>Intl</code> en <em>JavaScript</em>), et d'autant plus lorsqu'on fait des interfaces en français !</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Les <em>Workers</em> sont désormais considérés stables</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t\t<li>\n\t\t\t\t\t\t\t<p>Malheureusement, les modules <em>ECMAScript</em> (qui visent à remplacer le système de modules <em>CommonJS</em> à base de <code>require</code>), prévus pour la version <em>12.13 LTS</em>, ne sont pas exactement prêts et ont donc été plus ou moins repoussés à une prochaine version imminente</p>\n\t\t\t\t\t\t</li>\n\t\t\t\t\t</ul>\n\t\t\t\t</li>\n\t\t\t\t<li>\n\t\t\t\t\t<p>Pour plus d'informations, consultez l'annonce offcielle <a href=\"https://medium.com/@nodejs/node-js-12-to-lts-and-node-js-13-is-here-e28d6a4a2bd,\">https://medium.com/@nodejs/node-js-12-to-lts-and-node-js-13-is-here-e28d6a4a2bd,</a> la progression de l'implantation des modules <a href=\"https://github.com/nodejs/node/pull/29866\">https://github.com/nodejs/node/pull/29866</a> ou simplement la documentation <a href=\"https://nodejs.org/dist/latest-v13.x/docs/api/\">https://nodejs.org/dist/latest-v13.x/docs/api/</a></p>\n\t\t\t\t</li>\n\t\t\t</ul>\n\t\t</li>\n\t\t<li>\n\t\t\t<p>Après le partenariat de <em>CanIUse</em> avec <em>MDN</em>, c'est au tour de <em>Bocoup</em> de s'y associer en intégrant les résultats de la suite de test d'<em>ECMAScript</em>, <em>Test 262</em>, directement dans les pages de documentation du <em>MDN</em> ; c'est donc désormais plus de fiabilité pour les développeurs pour évaluer la compatibilité des moteurs <em>JavaScript</em> ; lisez l'annonce en détails : <a href=\"https://bocoup.com/blog/launching-test262-results-on-mdn\">https://bocoup.com/blog/launching-test262-results-on-mdn</a></p>\n\t\t</li>\n\t</ul>\n</div>\n",
	"banner_image": "./*.png"
}