This app lists all the browser versions supported by TAO in real time. The app uses the browserslist config from https://github.com/oat-sa/browserslist-config-tao and displays the list of supported browsers.
https://oat-sa.github.io/browserslist-app-tao
There are two ways to consume these data, either via API or in an iFrame.
A simple JSON API is available at oat-sa.github.io/browserslist-app-tao/api.json. If you wish you can also download a copy of the icon set as png or psd.
fetch('https://oat-sa.github.io/browserslist-app-tao/api.json')
.then(response => response.json())
.then(data => console.log(data));
Alternatively you can embed the page in an <iframe>
element. You can pass any number of options as URL parameters to adapt the look and feel.
<iframe src="https://oat-sa.github.io/browserslist-app-tao" height="…" width="…"></iframe>
Optionally you can overwrite the styles of the <body>
element and remove the page heading by adding parameters to the <iframe>
URL. The link to the repository will be removed by default.
<?php
$params = [
'background-color' => '#336',
'color' => 'silver',
'font-family' => 'Comic Sans MS',
'transform' => 'scale(.8)', // iframe will remain at the top left when scaled
'title' => false // this one removes the title, values can be `false` or `0`
];
?>
<iframe src="https://oat-sa.github.io/browserslist-app-tao?<?=http_build_query($params)?>" height="…" width="…"></iframe>
While the above example uses PHP, you can obviously do this manually as well. Be careful to encode the parameters, otherwise the #
on color values will break the query string.
npm ci
The app will be available on http://localhost:3000:
npm run start
There is a 2-step process to make the latest browsers available in the API:
An update PR will also be opened by an action once per month.
The following script installs the latest version of caniuse-lite
in the package-lock.json. Without it, the API can receive outdated browsers. The resulting updated file should be committed.
npm run update-db
The following script regenerates the file public/api.json
(by reading the configuration exported by the installed dependency @oat-sa/browserslist-config-tao/index.js
and passing that string into browserslist
). The resulting updated file should be committed.
npm run build-api
There is a script to build the API and the app, and deploy the result to Github Pages:
npm run deploy