Bug 255590 – ResourceTiming API does not include font resources loaded via CORS CSS in Safari

• Component: JavaScriptCore
• Status: NEW

Created attachment 465958 [details]
A sample project to demonstrate the issue

Description:

We have discovered an issue with the ResourceTiming API in Safari, where font resources loaded via a CSS file from a different origin (CORS) are not included in the list of resource timings. This issue is also present in the Chrome browser.

Steps to reproduce:

1. Set up a local environment with two servers: one to serve an HTML file, and another to serve a CSS file and a font file (using CORS).
2. In the CSS file, use @font-face to load the font from the second server.
3. In the HTML file, link to the CSS file from the second server and use the font in some text.
4. Use the ResourceTiming API to log the resource timings in the browser console.
5. Open the HTML file in Safari.
6. Use the performance.getEntriesByType('resource') method to get the list of resource timings.

Expected behavior:

The font resource should be included in the list of resource timings.

Actual behavior:

The font resource is not included in the list of resource timings.

Test environment:

Safari version: 16.4
Operating System: macOS 13.3.1

Additional information:

A sample project has been prepared to demonstrate the issue. You can find the project and instructions for setting it up in the attached archive. Additionally, a bug report has been filed for the same issue in the Chrome browser, which you can find here: https://bugs.chromium.org/p/chromium/issues/detail?id=1434243 . Notably, this issue does not occur in Firefox, where the font resource is correctly included in the list of resource timings.

[Radar WebKit Bug Importer]

<rdar://problem/108498735>