microsoft / microsoft/roosterjs

outlook.com: Text selection get undone when trying to change font because of Safari sniffing in rooster

Open
#3,318 2 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Dominant language
TypeScript
Stars
1.3k
Forks
190
Avg merge
1d 8h
Merged PRs (30d)
16

Description

This is happening when using the top and contextual menu for changing font in Outlook mail.

Office uses Microsoft's rich text editor, roosterjs, which sniffs for Safari and has it's own selection logic.
The WebKit fixed it partially by sending a Chrome UA string.

The bug persists with jus the chrome UA string.
roosterjs has it's own selection logic for Safari.
a change has been made in the FocusController to preserve selection when focus leaves a contentEditable root to a non-editable target.
https://github.com/WebKit/WebKit/pull/61173
https://bugs.webkit.org/show_bug.cgi?id=310549
We would like very much to avoid to have to quirk, but in the current circumstances this is the only solution to help our common customers.

Steps to reproduce the behavior:

  1. Go to outlook.com - login with test account
  2. Create New Email, type some text in the body - e.g. this is text
  3. Highlight text to apply formatting (more than one)
  4. Start with Font and once you apply font, try to do size change or anything else - selection is gone.

Expected behavior
Selection should stay on selected text so multiple formatting can be applied.

Device Information

  • OS: iPad
  • Browser Safari
  • Version 18.6.2 and 26.0 and future versions.

This creates a webcompat issue for Safari. @captainbrosset fyi.

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by tracing roosterjs's Safari detection and the FocusController selection handling mentioned in the issue. Reproduce the Outlook formatting sequence on Safari, then verify that the selected text remains available after changing the font and applying a second formatting change.

Written by the indexing model from the issue text.

Assessment

Tech stack
typescript
Domain
frontend, web-dev
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Quiet
Clarity
Mostly clear
Newbie friendliness
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.