1728999 - Support of CanvasRenderingContext2D.direction

Status: RESOLVED FIXED

(Core :: Graphics: Canvas2D, enhancement)

Description

[mistriela]

Attachment: canvas-direction-chromeVSfirefox.png

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/92.0.4515.159 Safari/537.36

Steps to reproduce:

Currently RTL support in HTML Canvas is not supported.
This causes corrupted RTL text rending in Firefox & GeckoView for the Hebrew & Arabic languages.

According to the MDN docs:
https://developer.mozilla.org/en-US/docs/Web/API/CanvasRenderingContext2D/direction

This is not supported.

Yet this has a huge impact on the web for users of RTL languages.

Actual results:

Open the following jsFiddle in Chrome and the in Firefox:

https://jsfiddle.net/mistriel/4mu386t5/

On FF the sentence is getting cropped and not displayed properly
See attached screen shots as well

Expected results:

The fiddle should have been displayed the same on both browsers.

Are you planning to support this feature ?
This is also highly required for my Company that relies on fabric.js library that is a High Level API for the Canvas.

We are currently facing this issue cannot find any alternative.
Please advise.

Comment 1

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'Core::Canvas: 2D' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Comment 2

[mistriela]

(In reply to Release mgmt bot [:sylvestre / :calixte / :marco for bugbug] from comment #1)

The Bugbug bot thinks this bug should belong to the 'Core::Canvas: 2D' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Was not aware for this component - you are right :-)

Comment 3

[mistriela]

Guys any thoughts about this ?

Comment 4

[Jonathan Kew [:jfkthame]]

Attachment: Bug 1728999 - Implement the CanvasRenderingContext2D.direction property. r=lsalzman

Comment 5

[Jonathan Kew [:jfkthame]]

Attachment: Bug 1728999 - Add simple WPT testcases for the CanvasRenderingContext2D.direction property. r=lsalzman

And remove failure annotations for a couple of existing tests that we now pass.

Depends on D142701

Comment 6

[Pulsebot]

Pushed by [e-mail]:
https://hg.mozilla.org/integration/autoland/rev/970ec2a9f31a
Implement the CanvasRenderingContext2D.direction property. r=lsalzman,emilio
https://hg.mozilla.org/integration/autoland/rev/7b0db7136784
Add simple WPT testcases for the CanvasRenderingContext2D.direction property. r=lsalzman

Comment 7

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Created web-platform-tests PR https://github.com/web-platform-tests/wpt/pull/33511 for changes under testing/web-platform/tests

Comment 8

[mistriela]

How can i test this ?

Comment 9

[Jonathan Kew [:jfkthame]]

(In reply to mistriela from comment #8)

How can i test this ?

It should work in Firefox Nightly (https://www.mozilla.org/en-US/firefox/channel/desktop/#nightly) starting from tomorrow's update (2022-04-06), I expect, as the fix is just going into the source code today.

Comment 10

[mistriela]

(In reply to Jonathan Kew (:jfkthame) from comment #9)

(In reply to mistriela from comment #8)

How can i test this ?

It should work in Firefox Nightly (https://www.mozilla.org/en-US/firefox/channel/desktop/#nightly) starting from tomorrow's update (2022-04-06), I expect, as the fix is just going into the source code today.

Awesome !
Will update

Comment 11

[Cristian Tuns]

https://hg.mozilla.org/mozilla-central/rev/970ec2a9f31a
https://hg.mozilla.org/mozilla-central/rev/7b0db7136784

Comment 12

[Web Platform Test Sync Bot [:wpt-sync] (Matrix: #interop:mozilla.org)]

Upstream PR merged by moz-wptsync-bot

Comment 13

[mistriela]

Awesome issue is resolved !
Tnx Jonathan Kew (:jfkthame) highly appreciated :-)