Page MenuHomePhabricator

Enable UI in Internet Explorer
Closed, ResolvedPublic

Description

As a stopgap until we're able to polyfill unsupported modules, let's add some conditional code to handle parts of our UI differently in IE and other browsers that don't support them.

This includes:

  1. In init.js we're using HTMLImageElement.decode() to improve the transition between the PHP UI and the JS UI. If that method isn't supported, we'll forego using it knowing that it might negatively impact UX during the transition.
  2. We're using the IntersectionObserver to lazy-load images when they enter the viewport. If that module isn't supported, we'll just load all images immediately.
  3. We're using the IntersectionObserver to automatically load more results on scroll. If it's not supported, just show the "load more" button after each batch.
  4. We're using the IntersectionObserver to help us add and remove a gradient on horizontally-scrolled elements (tabs and search filters) on small screens to indicate to the user that they can scroll to see more. If IntersectionObserver isn't supported, don't show the gradient at all.

Acceptance Criteria:

  • JavaScript UI works in Internet Explorer 11
  • JS UI is unchanged in modern browsers

Event Timeline

Change 630956 had a related patch set uploaded (by Anne Tomasevich; owner: Anne Tomasevich):
[mediawiki/extensions/WikibaseMediaInfo@master] Improve MediaSearch experience in IE

https://gerrit.wikimedia.org/r/630956

Change 630956 merged by jenkins-bot:
[mediawiki/extensions/WikibaseMediaInfo@master] Improve MediaSearch experience in IE

https://gerrit.wikimedia.org/r/630956

Etonkovidova subscribed.

Checked in IE and also did some cross-browser check. There are two issues that seem to be specific to Internet Explorer (at least I could no reproduce it in other browsers) - filed as T266076: [M] IE11 - MediaSearch UI issues.

Given that it's only IE issues, T266076 is not a blocker. Will do additional testing in production.

Etonkovidova updated the task description. (Show Details)