BackToTop - full screen demo broken

[nicolethoen]

The full screen demo is not displaying the backToTop component.
https://staging-v6.patternfly.org/components/back-to-top/react-demos/using-name-selector/

I've noticed that the component is also not being displayed on staging-v6.surge.sh, i'm not sure if it's due to the same issue that's broken this demo. A followup issue in org might be necessary.

it also has two different scrollbars, is that intended?
@srambach @andrew-ronaldson @mcoker

[mcoker]

I think the double scrollbars is maybe from <Page> as a child of <DashboardWrapper>?

patternfly-react/packages/react-core/src/demos/examples/BackToTop/BackToTopNameDemo.tsx

Lines 25 to 27 in bf19a67

	<DashboardWrapper breadcrumb={null}>
	<Page>
	<PageSection variant={PageSectionVariants.light}>

[andrew-ronaldson]

I see there is a switch to turn on Always show BackToTopButton but is this demo supposed to show it only after scrolling?
The fake text about overpass should probably be changed since that is no longer accurate.

[nicolethoen]

Ah - I was seeking a demo to show me how to make it appear on scroll because that was behavior that seemed broken on org. so if that's not the intention here, i still have to figure out why it's not working on the org side...

[mcoker]

Discussed in a working session

• Need to remove the nested <Page> in <DashboardWrapper>
• We can remove this from the currently scrollable page section

  patternfly-react/packages/react-core/src/demos/examples/BackToTop/BackToTopNameDemo.tsx

  Lines 38 to 41 in 53ca336

  	hasOverflowScroll
  	name="scrolling-section"
  	tabIndex={0}
  	aria-label="Scrollable container of demonstration cards with a back to top element"

• Update the scrollableSelector on the <BackToTop> component in that demo (below) to scrollableSelector='[class="pf-v6-c-page__main-container"]'

  patternfly-react/packages/react-core/src/demos/examples/BackToTop/BackToTopNameDemo.tsx

  Line 62 in 53ca336

  <BackToTop scrollableSelector='[name="scrolling-section"]' isAlwaysVisible={isAlwaysVisible} />