Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(tooltip): remove redundant scroll offset #4958

Merged
merged 4 commits into from
Nov 9, 2023

Conversation

csholmq
Copy link
Contributor

@csholmq csholmq commented Oct 19, 2023

📑 Summary

window.scrollY is already account for which means document.body.scrollTop incorrectly offsets the tooltip vertically.
The same is not true for horizontal position.

📏 Design Decisions

Removing one of the scroll offsets should set things straight. Not tested as I don't know how to.

📋 Tasks

Make sure you

@netlify
Copy link

netlify bot commented Oct 19, 2023

Deploy Preview for mermaid-js ready!

Name Link
🔨 Latest commit 4a92fc5
🔍 Latest deploy log https://app.netlify.com/sites/mermaid-js/deploys/654c9d547fa51d0008878cce
😎 Deploy Preview https://deploy-preview-4958--mermaid-js.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site configuration.

@github-actions github-actions bot added the fix label Oct 19, 2023
@codecov
Copy link

codecov bot commented Oct 19, 2023

Codecov Report

Merging #4958 (4a92fc5) into develop (72038a6) will increase coverage by 2.86%.
Report is 16 commits behind head on develop.
The diff coverage is n/a.

Additional details and impacted files

Impacted file tree graph

@@             Coverage Diff             @@
##           develop    #4958      +/-   ##
===========================================
+ Coverage    76.45%   79.32%   +2.86%     
===========================================
  Files          164      164              
  Lines        13842    13842              
  Branches       693      693              
===========================================
+ Hits         10583    10980     +397     
+ Misses        3105     2713     -392     
+ Partials       154      149       -5     
Flag Coverage Δ
e2e 85.22% <ø> (+3.57%) ⬆️
unit 42.88% <ø> (ø)

Flags with carried forward coverage won't be shown. Click here to find out more.

Files Coverage Δ
packages/mermaid/src/diagrams/flowchart/flowDb.js 81.74% <ø> (-1.91%) ⬇️

... and 21 files with indirect coverage changes

@csholmq
Copy link
Contributor Author

csholmq commented Oct 20, 2023

Tested manually on a rendered page.

Before scrolling:
image

After scrolling:
image


After fixes (despite scrolling):
image

Copy link
Member

@sidharthv96 sidharthv96 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Love to see a magic number disappear.

packages/mermaid/src/diagrams/flowchart/flowDb.js Outdated Show resolved Hide resolved
window.scrollY is already account for which means document.body.scrollTop incorrectly offsets the tooltip vertically.
The same is not true for horizontal position.
Position the tooltip centered, just below the node being hovered.

Update packages/mermaid/src/diagrams/flowchart/flowDb.js

Co-authored-by: Sidharth Vinod <[email protected]>
@csholmq
Copy link
Contributor Author

csholmq commented Nov 1, 2023

@sidharthv96 I have no idea why the linting job failed. Doesn't seem to complain over actual linting but something with the setup.

* develop: (21 commits)
  Fix typo
  fix typo
  Add new Atlassian integrations
  chore(deps): update all patch dependencies
  chore: release v10.6.1
  fix(flow): fix invalid ellipseText regex
  review fixes
  Update XYChart's nav link in the docs template
  Update index.md
  add comment for ts ignore
  move decodeEntities to utils
  review fixes
  chore(deps): update all minor dependencies
  chore: Point to correct changelog
  add spec
  fix: getMessageAPI so it considers entity codes
  Update classDiagram.md
  Chore: Typo fixed in multiple files
  feat(gantt): update styles
  docs(integrations): add Mermaid for Slack
  ...
@sidharthv96
Copy link
Member

The lint was failing because there was an unnecessary space in the changes. I've fixed it.

@sidharthv96 sidharthv96 enabled auto-merge November 9, 2023 08:51
@sidharthv96 sidharthv96 added this pull request to the merge queue Nov 9, 2023
Merged via the queue into mermaid-js:develop with commit 1571b25 Nov 9, 2023
16 checks passed
Copy link

mermaid-bot bot commented Nov 9, 2023

@csholmq, Thank you for the contribution!
You are now eligible for a year of Premium account on MermaidChart.
Sign up with your GitHub account to activate.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants