Commit graph

442 commits

Author SHA1 Message Date
Jon Robson 6924a89b07 Generalize settings code
A new REGISTER_SETTING action replaces the BOOT action for
registering settings. This allows custom preview types to be
associated with a setting. They do this by adding the enabled
property to the module they provide to mw.popups.register

Every time the new action is called, we refresh the settings
dialog UI with the new settings.

Previously the settings dialog was hardcoded, but now it is generated
from the registered preview types by deriving associated messages
and checking they exist, so by default custom types will not show
up in the settings.

Benefits:
* This change empowers us to add a setting for Math previews to allow
them to be enabled or disabled.
* Allows us to separate references as its own module

Additional notes:
* The syncUserSettings.js changeListener is no longer needed as the logic
for this is handled inside the "userSettings" change listener in response to
the "settings" reducer which is responding to
SETTINGS_CHANGE and REGISTER_SETTING actions.

Upon merging:
* https://www.mediawiki.org/wiki/Extension:Popups#Extensibility will be
updated to detail how a setting can be registered.

Bug: T334261
Bug: T326692
Change-Id: Ie11057052fb9035944f2b79a17fb486f97102994
2023-10-17 15:08:15 +00:00
Jon Robson 614039b7df mw.popups.isEnabled should always return boolean
Mismatch between documentation and function signature

Bug: T346106
Change-Id: I43e0efc67b76496aab228b3f971db795662337cf
2023-10-16 10:44:43 -07:00
WMDE-Fisch 90a829179c Better support RTL direction extracts in ReferencePreviews
When the user sets a different language than the projects content
language, ReferencePreviews were rendered LTR. By using the bdi
tag this behavior is fixed.

Note that PagePreviews gets language and direction from the
TextExtracts response and use them to achive the same. The latter
is not straight forward available for ReferencePreviews so I'm
using bdi to achieve the same.

Bug: T345833
Change-Id: I6554e6e1db3aac06c04c9185500e05de238adde2
2023-10-04 15:28:00 +02:00
Jon Robson 6d0cdc9e45 Disable error logging
The rate is unexpected:  over 5 million in the last 7 days
I don't time to investigate this further so suggest disabling this
for now.

Change-Id: Ie55d1da1652239ad4f6ea94743d6efdd12de9974
2023-09-27 08:47:35 -07:00
WMDE-Fisch 26c0e592a5 Disable reference previews when the navigation popups gadget is used
Otherwise we will have two popups for references when hovering.

Bug: T347391
Change-Id: I8332e9fe6e214b2bd3491adb2bedcae2870f34c7
2023-09-26 14:44:05 +02:00
Jon Robson 961778b3c5 Disable error logging for missing settings cog on references beta feature
Bug: T346404
Change-Id: I36b1759f6d00ff6ce584a1bc1ac68dedd633fc6a
2023-09-15 09:49:30 -07:00
bwang 154912e5db Rename icon classes in Popups to use popups-icon prefix instead of mw-ui-icon, replace resource loader icons with codex
Bug: T345653
Change-Id: I19b9861850064df50d6b88cda748feff6231091c
2023-09-12 10:56:53 -05:00
thiemowmde 8c5120c2a6 Fix settings button not working on reference previews
Apparently caused by a mistake in I8697232, and the QA for T340256 not
covering the full functionality of what was changed in the patch.

Bug: T345829
Change-Id: I482d32183ef7f2226c7ad114be0fbaf97bc7b898
2023-09-08 23:45:29 +00:00
bwang b78cfe50c9 Replace mediawiki.ui.icon with Codex, update preview markup and styles to be more consistent
- Removes .mw-ui-icon and .mw-ui-icon-element
- Aligns markup/styles between generic and disambiguation previews
- Update padding for generic and disambiguation previews to be the same as other popups, results in minor visual changes

Bug: T341899
Change-Id: I9a58fc6a93160d07452ea6f903e1797dd9421d92
2023-08-21 19:53:51 +00:00
Jon Robson 9aa07d0809 Model: Make dwell delay part of model and registration
Dwell delay varies between popup type so should be part of the
definition. Since this is needed by reference tooltips we should
make this part of the Page preview model. This will allow us to
separate concerns of the architecture and reference  tooltips
for better maintenance between WMDE and web team.

Bug: T326692
Change-Id: Ia021c8b90fd69d70c4b33744520bb963a65db036
2023-07-26 17:42:56 -07:00
Jon Robson 5af31b5524 Don't log for documentElement (nodeType 9)
Follow up to Ia011aaf9f8b5b932695da3311f849682c0105cfe

Bug: T340081
Change-Id: Ibff26eb90fd650532a7e23ac16232366676c0d15
2023-07-18 20:34:47 +00:00
Jon Robson a80d2b1f56 Add additional debugging closest bug
Use the topic "error.web-team" - error prefix necessary
for it to be treated as an error, and 'web-team' moves
it off main channel.

Error logs tagName and nodeType which should be sufficient
for us to understand this issue. Can expand with other
information later if need be. Cannot add to stack trace
as any non-standard stack trace would be dropped by the intake
code.

Bug: T340081
Change-Id: Ia011aaf9f8b5b932695da3311f849682c0105cfe
2023-07-17 14:54:12 -07:00
bwang 6b659443b5 Update popups to use codex buttons over mediawiki.ui.buttons
- Provides missing accessible label for the settings button

Bug: T340256
Change-Id: I86972322ae34f1d1df8d79c66daa9e34091f9dd3
2023-07-10 16:03:36 -05:00
Moh'd Khier Abualruz 67a718a5be TypeError: n.closest is not a function
- check if the element has the function in it before using it
- implementing a native code to get the same result based on polyfill examples
- fix Coverage Block

Bug: T340081
Change-Id: I1c2ce46a88cde6323ab862964062dd722ff5edcb
2023-07-10 11:48:40 -07:00
Jon Robson 9ee816a919 When extract is a string treat it as HTML
According to the docs:
The Element.append() method inserts a set of Node objects or string
objects after the last child of the Element.
String objects are inserted as equivalent Text nodes.

When given a string we want to treat these as HTML

Also fix the storybook which hinted at this being a problem
(incorrectly fixed in 504eefcc1)

Bug: T341318
Change-Id: I415c9821a6a37b45cf0f8a65f58a41bc7d0a042d
2023-07-07 10:09:28 -07:00
Jon Robson 049729626c IP masked users use localStorage for settings
Bug: T330517
Change-Id: Ib283e37f379e8cccc7f49ab0ce9aadd6535ea668
2023-06-14 08:16:50 -07:00
Jon Robson 580067b94e Discourage jQuery usage in Popups extension
Change-Id: Iff0c81e4c1d78cc52d1bd9d81e24d8fae228c9bc
2023-06-13 15:39:57 -07:00
Jon Robson 7c592bc790 Prefer native JavaScript to jQuery
Bug: T315929
Change-Id: I949fd9551269a3cb9d9df7744149510949d3076c
2023-05-21 16:53:50 +00:00
Jon Robson 323d770d66 Use native JavaScript to build thumbnail clip path
Change-Id: Ib5d734fde88eaa20ec866722af3de37abe694add
2023-05-16 17:19:47 -07:00
Jon Robson 1ee66bbf72 Don't use parseHTML in parseHTMLResponse
These changes impact the preview itself and the settings
dialog which shows to anonymous users

Change-Id: If288161fb5eb4446a79e68841ab53a6c713f1d3a
2023-05-16 17:18:06 -07:00
Umherirrender 7a6cac8a64 build: Updating eslint-config-wikimedia to 0.25.0
Change-Id: Ic511f54b58947a2694514e2d417e022bdeae219d
2023-05-16 00:22:03 +02:00
Jon Robson 875f7ffcad Use native JavaScript for creating the footer link
The footer link shows when a page preview has been disabled
by an anonymous user via the settings cog.

Change-Id: I236a620322716f42443fc3d90a0405352132a99f
2023-05-15 14:19:41 -07:00
Jon Robson 76973662d1 Fixes: Uncaught TypeError: n.closest is not a function
Previously we did a try/catch when closest didn't exist. Now that's
gone we're flagging this issue.

Follow up to Ia45c03d1fd6949bf83ebed6d40075e453e42cdd7

Bug: T336650
Change-Id: I7a4f453ae1a4a8222863a8342a27d615883d339a
2023-05-15 07:27:22 -07:00
Jon Robson 428c32d027 Switch to native Promises and fetch
For fetch and AbortController we provide native polyfills (see
resources/src/skip-web2017-polyfills.js) so safe to use this here.
This will be empty for modern browsers.

Change-Id: Ic0f55eb0a0276be3587a4b866834bddff1124ad2
2023-05-12 21:34:42 +00:00
Jon Robson 8f03303dc4 Restrict page previews to browsers that support multiple not selectors
Change-Id: Ia45c03d1fd6949bf83ebed6d40075e453e42cdd7
2023-05-12 13:43:18 -07:00
Jon Robson d4376bf203 Load Modules support initialization
Rather than obscurely loading instrumentation code as a side
effect of loading UI code, run it explicitly inside the index.js
initalization code. Instrumentation is moved to its own file
and Popups modules now support an init function.

Change-Id: I9d2643ec8fb4e1dedc7ab9534b2965272f12335f
2023-05-11 23:22:51 +00:00
Jon Robson f9b9feaff5 ES6: Prefer Object.assign and Promise to jQuery
Additional change:
* Lint dist folder as ES6 code now ES6 is everywhere

Change-Id: Ie77046f5c6fbdafa4679dbaf97f7bf6f16292b9c
2023-04-19 17:02:14 -07:00
Jon Robson 2969d67256 Use native JavaScript for event handling
Change-Id: I786d906217ac42f54d498df05b6a172371db7808
2023-04-14 15:39:22 -07:00
Umherirrender 3573232c21 build: Updating npm dependencies
* eslint-config-wikimedia: 0.22.1 → 0.24.0
* @wikimedia/mw-node-qunit: 6.3.3 → 7.0.0

Change-Id: I348eb70bfc6c1d6c922c8290152926183712dee1
2023-04-03 23:14:47 +02:00
Jon Robson d12c4fe1d8 Don't sync non-existent value
eventlogging reducer was removed in
I640ab367cd235ab8da7dd70dbef7ae9076712e84 so this is syncing
a non-existent value.

Change-Id: I58386bf9a0219f6344c08f757af3aaafbae92751
2023-03-22 19:15:53 +00:00
Jon Robson 7ab0b63f80 Don't show page previews on hash fragments
Bug: T198652
Change-Id: I036266bf4fb98ffa20509440e553b29e8dcc4e1f
2023-01-11 15:21:47 -08:00
Jon Robson 7295ee3a6a Account for syntax errors in closest selector
Certain browsers have the closest method but do not
support not selectors with multiple arguments. This
variant caters for both.

Bug: T325113
Change-Id: Ib5fc912bfe0f831fea4c9882c25b27541d83b66f
2022-12-13 14:14:35 -08:00
Jon Robson 01e3ddcda5 Child elements also trigger previews
Follow up to
Iefe98c1f0422dbf034e385b1a41a859d030a2cf4 where we switched from the
jquery event delegation pattern to native methods. One thing that we
overlooked was that we also need to consider the case where the selector
matches the parent of an element, for example a span nested inside an
eligible link. I've rethought this logic, to first find the closest
eligible element to normalize the element passed to model methods
before running matchesSelector.

Bug: T325007
Change-Id: I4133751dc900a51829173e9c0d965cbb18e6a33e
2022-12-13 00:52:37 +00:00
Jon Robson 898fc81998 Avoid syntax error on hover in grade C browsers
Adjust the logic of elementMatchesSelector to fallback
to jQuery when the native matches fails.

Follow up to
Iefe98c1f0422dbf034e385b1a41a859d030a2cf4

Bug: T324514
Change-Id: I0e9e894e77e2eb29fee65853aa98b141bc2a11a3
2022-12-06 07:41:22 -08:00
Jon Robson 0febc3f54d Extensible previews
Allow extensions to register new types of previews via
extension attributes.

Changes:

- The check for reference previews doesn't make sense
as $('a[ href*="#" ]' ) will match any elements with a hash
fragment, so the additional check to Title.getFragment
will not provide a different result. This was introduced in
I9ec57e0fbb0d21beaaa7b359c1c2bef64d2c14f5
- Links that point to themselves are marked with mw-selflink
in MediaWiki so this can use the not selector we already have.
- The new API is used internally and only available via extension
Attributes
- An example is provided in SkinJSON
(https://github.com/jdlrobson/mediawiki-skins-skinjson/pull/14)

Bug: T233099
Change-Id: Iefe98c1f0422dbf034e385b1a41a859d030a2cf4
2022-11-22 08:45:27 -08:00
Thiemo Kreuz 988fe3fe07 Lowercase {jQuery…} type hints everywhere
I think this is the more canonical variant.

Change-Id: I7dcdfeb82153f5b903378027712f16c20cc111eb
2022-10-04 15:54:20 -07:00
Ed Sanders 883c8c1aca build: Update eslint-config-wikimedia to 0.22.1
Change-Id: I055517998ed06fccdf50ec31251ea6aa9040abb5
2022-02-28 13:18:24 +00:00
Fomafix 0140767ea2 Simplify addClass with an array of classes
Since jQuery 3.3 .addClass() supports arrays. [1]

Replace
  .addClass( classes.join( ' ' ) )
by
  .addClass( classes )

[1] https://blog.jquery.com/2018/01/19/jquery-3-3-0-a-fragrant-bouquet-of-deprecations-and-is-that-a-new-feature/

Change-Id: Id5c0325971f3e9773155df7412ad0850cfaa11fd
2021-10-18 08:55:42 -07:00
jdlrobson fa19ee0d4f Adjust previews to meet specifications
Apply max-heights and tweak some of the margin values

Bug: T284643
Change-Id: I0c8a77e10c36ae444e541bb52a8797594c77db63
2021-08-25 22:55:26 +00:00
sahil 7142676629 selenium: Upgrade WebdriverIO to v7
Update npm packages: @wdio/* and webdriverio.

Bug: T274579
Change-Id: Ie9bd50e36f0c888a19e73ab9b424a8b6a5bd67fd
2021-08-24 17:29:16 +00:00
Timo Tijhof 06ab2d7676 build: Fix gaps in lint coverage and update old patterns
eslint:
* Remove hardcoded glob paths that are (relatively slow) to expand
  before linting could start, in favour of specifying directories
  which can be iterated while linting happens.
* JSON files in i18n/ were skipped, unlike other repos.
  JS code under .storybook/ was skipped.
  JS code under resources/ext.popups/ was skipped.
  Fix all these by doing what other repos do, which is to let
  ESLint iterate the repository and tell it which directories not to
  enter. This has the happy side-effect of making IDE integrations
  for ESLint work correctly (as customisation in package.json has the
  same problems as using Gruntfile, namely that invoking 'eslint'
  directly can't be aware of this), as well as allowing things like
  `eslint --fix` to be used.

```
/Popups/resources/ext.popups/index.js
  4:2  error  Unexpected var, use let or const instead  no-var
```

nyc:
* Remove SPAWN_WRAP_SHIM_ROOT.
  This was a hack for an early CI experiment that hasn't been
  needed for several years.

storybook:
* Remove gitignore entries for additional npm and build output in the
  storybook subdirectory, which appears to not exist anymore since
  189b386a13.

Doxygen:
* Sync with cookiecutter example from
  https://gerrit.wikimedia.org/g/mediawiki/tools/cookiecutter-library/+/HEAD/
  - remove redundant stuff,
  - enable quiet mode to hide verbose non-warning,
  - include CoC.

Change-Id: If8f6b833067192aea96a87f04c7978c9af11f996
2021-08-16 17:02:05 +00:00
Thiemo Kreuz a99bd13112 Rewrite linkTitle change listener for clarity/easier expansion
This was done while working on T277639 where we introduced
multiple "enabled" flags for individual popup types. This
change listener is one of very few places that work with
this flag. This patch is meant to make this code more robust
and easier to change.

A few unrelated but trivial changes are included that make
code shorter and hopefully easier to read.

Also fixes a bug with tooltips overlapping previews.

Bug: T287119
Change-Id: I7fb0a8d4bb9f5e78fe62cfca524cc157ea89a233
2021-08-11 18:33:34 +00:00
jdlrobson 75a9d81755 Fix pointer class behaviour
Add unit tests for landscape previews.

Bug: T287520
Change-Id: Ib9a7635b532248a4f44c308d7bb5dc7ab08667e6
2021-08-10 10:40:40 -07:00
jdlrobson a0754c8cf9 Storybook: Fix RTL
Provide containers for page previews examples

In storybook we avoid position absolute but this deviation from
how they behave in reality could lead to subtle differences that impact
the rendering of previews. It also doesn't allow to see the preview
in the context of the link which is an important part of visually
verifying the position of the pokey arrow.

This also allows us to rethink the broken RTL mode. We now scope
LTR rules to a LTR class that is present on the container, and use
the CSSJanus parsed stylesheet for RTL.

Change-Id: I189019824ddd6aa759790fd162ffcd543619a953
2021-08-06 14:40:10 +00:00
Thiemo Kreuz a01c31efd7 Show medium size (<320 wide, but >=250 high) images as well
The requirement for landscape images is to be at least 320px
wide. The requirement for portrait images is more relaxed,
only 250px high. Images that fall between these two
requirements currently don't show a thumbnail, even if they
could.

This change affects a very specific group of images:
* Square images from 250 x 250 to 319 x 319.
* Landscape images from 251 x 250 to 319 x 250.
* Landscape images from 319 x 250 to 319 x 318.

The most extreme ratio is 319 x 250. This will be cut to
203 x 250. I.e. the absolute extreme are 58px missing left
and right, but never more.

Requested at https://www.mediawiki.org/wiki/Topic:Vwl97pm6as9fuf6k

Additional stories for testing more extreme small images:
* Small Tall - 300x1000px
* Small Short - 300x200px

Update tests accordingly.

Bug: T268999
Change-Id: I811f1c0e7e9b0c30280b36a61cc7831a5b9e58c8
2021-08-03 13:17:06 -06:00
Sam Smith 8f5000f346 Remove Popups instrumentation
Bug: T267211
Change-Id: I640ab367cd235ab8da7dd70dbef7ae9076712e84
2021-07-29 17:01:01 +00:00
Thiemo Kreuz 5d2c5aeaa1 Remove a small piece of unused code from reference.js
Turns out this was only in place because the test was
(intentionally) incomplete. But it's dead code in
production. Let's get rid of it.

Change-Id: Ieeb145b6972dceb7eeda3a167d907b680d5c3ce4
2021-05-07 16:43:01 +02:00
Thiemo Kreuz 8a08a88f66 Remove/update some ESLint exclusions
Change-Id: Icd4c2d968e2b445a54709368de056373a7814919
2021-05-07 16:26:00 +02:00
Thiemo Kreuz e4da147efa Update JSDoc types and comments to be more specific
For example: We know the HTML element we are dealing with is
always an <a> element.

I believe the small changes in this patch are all obvious and
non-controversial. Please let me know if you disagree.

Change-Id: I9fe15845affffdd0f5f0fd6ef7d6b607cb567ac7
2021-05-07 11:57:58 +02:00
Thiemo Kreuz 92864de4d0 Tune confusing log error down to a warning
This is not really an error. It does not really have
consequences for the user, except:
* It might waste bandwidth because the module is loaded, but
  unused.
* It might waste a tiny bit of CPU time.
However, this can only happen for registered users, and only
with very specific combinations of settings (notably: a
conflicting gadget must be activated).

The reason it's marked as an error is that previously we could
give more guarantees about this. This changed recently. We will
check if the log message is still helpful and either remove it,
or restore the previous guarantees.

Bug: T271206
Change-Id: I218726c9c4879a405acef68710e79c6ac8d070fe
2021-05-06 10:08:29 +02:00