Skip to content

[Bug]: Coachmark doesn't render teaching bubble in the correct place when not in the right #23545

@PatoBeltran

Description

@PatoBeltran

Library

React / v8 (@fluentui/react)

System Info

System:
    OS: Windows 10 10.0.22621
    CPU: (8) x64 Intel(R) Core(TM) i7-8650U CPU @ 1.90GHz
    Memory: 5.93 GB / 15.92 GB
  Browsers:
    Edge: Spartan (44.22621.160.0), Chromium (102.0.1245.41)
    Internet Explorer: 11.0.22621.1

Are you reporting Accessibility issue?

no

Reproduction

Repro in docs https://developer.microsoft.com/en-us/fluentui#/controls/web/coachmark#ICoachmark

Bug Description

Actual Behavior

When rendering the coachmark in the center of the target, once it is open to a teaching bubble, it renders all to the right (instead of centering with the target), once you click outside of it, it jumps to the center position.

coachmark.mp4

This video was recorded from your docs site.

Expected Behavior

The teaching bubble should be rendered at the center and if you click outside of it it shouldn't jump to a different place.

Logs

No response

Requested priority

Normal

Products/sites affected

IoT Central

Are you willing to submit a PR to fix?

no

Validations

  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • The provided reproduction is a minimal reproducible example of the bug.

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions