Don't cycle carousel when the page isn't visible

[cvrebert]

This uses the Page Visibility API (when available) to stop cycling the carousel when the page is hidden (e.g. in an inactive tab, minimized window, etc.).
This seems like better UX and also improves perf when the page is hidden (browser has less work to do).
This also addresses #15298 by not sliding while the page is hidden in Chrome in the first place (thus preventing the problematic situation from occurring).

[XhmikosR]

This was one of the suggestions I had made in the past so I'm definitely for it 👍

[cvrebert]

CC: @hnrch02 @fat

[hnrch02]

Great idea 👍

[StevenBlack]

I suggest this new behaviour should tie-into carousel options; that said, this PR seems like a sensible Carousel.DEFAULTS behaviour, though setting the default to false is guaranteed non-breaking.

[cvrebert]

I'm having a hard time envisioning a case where it's desirable to slide things even when the user isn't watching them. If anyone has such a use case, please speak up.
We're trying to sell this as a bugfix / implementation-detail rather than a new feature per se.

[StevenBlack]

@cvrebert Carousel as news ticker, for example, like tweets and hash tags on current events.

Moreover Carousel already has a pause: 'hover' default, a paused property, and possesses function paused() on its prototype. Therefore pausing looks baked-in already.

Maybe Carousel pausing on visibility should use Carousel.pause()?

[cvrebert]

Carousel as news ticker, for example, like tweets and hash tags on current events.

That seems relatively niche, but I'd be interested to hear the rest of the team's thoughts on it.

Maybe Carousel pausing on invisibility should use Carousel.pause()?

That leads to some questions around "What happens if the page explicitly calls pause() while it's hidden?" In that case, when it becomes un-hidden, does the Carousel start cycling, or not? If not, then the code gets a bit more complicated.

[hnrch02]

I think it will be fine as long as we point out in the release notes that this changes the default behavior.

[cvrebert]

@XhmikosR What's your opinion after StevenBlack's remarks?

[XhmikosR]

The use case @StevenBlack describes seems a valid one indeed.

But, wasting power is never good, so I'm still in favor of this change as long as we do it in a major version bump.

[StevenBlack]

@cvrebert just kick me for being redundant but Carousel pausing on scroll should be configurable — default true is certainly OK — also .paused, .paused(), and .pause() exist so let's use these so state is managed consistently.

[cvrebert]

@StevenBlack Scrolling is a separate issue entirely. File a new bug if you care about it.

[cvrebert]

as long as we do it in a major version bump.

Punting this to v4 then.