Custom Fonts Not Working in Flet Web Apps Using CanvasKit

[nssnaresh5]

Duplicate Check

• I have searched the opened issues and there are no duplicates

Describe the bug

Custom fonts defined using page.fonts and Theme.font_family are not applied correctly in web apps when rendered with CanvasKit. Instead, the default sans-serif font is used.

Code sample

Code

page.fonts = {
    "CustomFont": "/assets/fonts/YourFont-Regular.ttf"
}
page.theme = ft.Theme(font_family="CustomFont")
page.add(ft.Text("This is a test", font_family="CustomFont"))

To reproduce

1. Define a custom font in the page.fonts property
   page.fonts = {
   "CustomFont": "/assets/fonts/YourFont-Regular.ttf"
   }
   page.theme = ft.Theme(font_family="CustomFont")

2. Add a Text widget with the custom font:
   page.add(ft.Text("This is a test", font_family="CustomFont"))

3. Run the app in the web browser
   ft.app(main, assets_dir="assets", view=ft.AppView.WEB_BROWSER)

Expected behavior

The Text widget should display the specified custom font.

Screenshots / Videos

Captures

[Upload media here]

Operating System

Windows

Operating system details

11

Flet version

Name: flet Version: 0.24.1 Summary: Flet for Python - easily build interactive multi-platform apps in Python Home-page: https://flet.dev Author: Appveyor Systems Inc. Author-email: [email protected] License: Apache-2.0 Location: C:\Users\NS1\PycharmProjects\EPC3X.venv\Lib\site-packages Requires: cookiecutter, fastapi, flet-runtime, packaging, qrcode, uvicorn, watchdog Required-by: flet-web

Regression

No, it isn't

Suggestions

Expected Behavior: The Text widget should display the specified custom font.

Actual Behavior: The Text widget displays the default sans-serif font.

Additional Context:

The issue occurs when running the app with ft.AppView.WEB_BROWSER.
The font works correctly in desktop apps.

Logs

Logs

[Paste your logs here]

Additional details

No response