palantir/blueprint

Toaster (static usage): Toast Notifications no longer appear at bottom of a scrolled page (regression)

Open

#4,864 建立於 2021年8月20日

在 GitHub 查看
 (3 留言) (0 反應) (0 負責人)TypeScript (20,263 star) (2,167 fork)batch import
Package: coreStatus: needs fix verificationType: bughelp wanted

描述

Environment

  • Package version(s): 3.48.0
  • Operating System: Windows 10
  • Browser name and version: Google Chrome 92.0.4515.159

Code Sandbox

https://codesandbox.io/s/vibrant-waterfall-9bjnr

Steps to reproduce

  1. Use toaster component statically (toaster = Toaster.create(...)) with positioning set to bottom
  2. Display a toast (toaster.show(..)) while the page is scrolled

Actual behaviour

The toast notification appears at a location that isn't the bottom of the viewport. This behaviour seems to have been introduced in version 3.40.0.

Expected behaviour

Expected the behaviour of previous blueprintjs versions (i.e. 3.39.0):

  • Toast notifications always appear at the bottom of the viewport, regardless of scroll location.
  • Position of notification remain at the bottom while scrolling

Possible solution

Set toaster container to always use fixed positioning via CSS:

.bp3-toast-container {
  position: fixed !important;
}

This may break non-static usage of the toaster component (especially when usePortal=false)

貢獻者指南