String.prototype.substr() is deprecated so we replace it with String.prototype.slice() which works similarily but isn't deprecated.
Signed-off-by: Tobias Speicher <rootcommander@gmail.com>
Co-authored-by: Jarek Radosz <jradosz@gmail.com>
The links returned by post.url and topic.url are relative, but contain
the subdirectory. When getAbsoluteURL is called to construct the
complete share URL, it adds the host and the subdirectory again. As a
result the created URLs contained the subdirectory twice.
The user avatar in posts has aria-hidden set to true to reduce
redundancy since the information that the avatar gives to screen readers
is the same information that the username/name of the post gives which
is the author of the post.
However, it's still possible for a screen reader user to reach the
avatar by tabbing through the post and when that happens the avatar is
read as "blank". This isn't ideal so we should set tabindex to -1 on the
avatar to remove it from the default keyboard nav flow.
The changes are:
* Add an aria-label for the button that embeds/expand the replies of a
post below it
* Add an aria-label for the button that collapses the embedded replies
* Add an aria-label to describe the embedded replies section when
expanded and an aria-label for each embedded reply
The improvements are:
* Add an aria-label to the like/read count buttons below posts to
indicate what they mean and do.
* Add aria-pressed to the like/read count buttons to make it clear to screen
readers that these buttons are toggleable.
* Add an aria-label to the list of avatars that's shown when post likes
or readers are expanded so that screen reader users can understand what
the list of avatars means.
The tabLoc is a hidden element inside the post region that we use to
move the focus close to the post that's visually highlighted (by
changing the background color and then fading it away) when a topic is
opened so that screen readers can start reading from that post rather
than the top of the page.
Some screen readers get confused by the tabLoc element being an `<a>`
element and read out the topic ID and I've found that changing the tag
to `<span>` fixes the problem.
More precisely, if popper can't position something at the bottom, it will automatically attempt to position it at the top. However we should ensure it doesn’t consider the space under the d-header as valid space, when header's height is taken into consideration if top space is not enough, we should force bottom, and flip it back.
This logic is not necessary on modals as the d-header is not present.
This commit introduces a new use_polymorphic_bookmarks site setting
that is default false and hidden, that will be used to help continuous
development of polymorphic bookmarks. This setting **should not** be
enabled anywhere in production yet, it is purely for local development.
This commit uses the setting to enable create/update/delete actions
for polymorphic bookmarks on the server and client side. The bookmark
interactions on topics/posts are all usable. Listing, searching,
sending bookmark reminders, and other edge cases will be handled
in subsequent PRs.
Comprehensive UI tests will be added in the final PR -- we already
have them for regular bookmarks, so it will just be a matter of
changing them to be for polymorphic bookmarks.
`keyUp` is only invoked if the component's root element (or one of its descendants) has focus which isn't great for keyboard users because if they open a user card and want to close it, they have to tab through to the user card and only then will the Esc key actually close the card. This commit adds a `keyup` event listener on the `document` for the Esc key so that the user card is closed (if it's open) no matter where the focus is.
Since 3fd7b31a2a some tests
were failing with this error:
> Error: Unhandled request in test environment: /c/feature/find_by_slug.json
> (GET) at http://localhost:7357/assets/test-helpers.js
This commit fixes the issue by adding the missing pretender. Also
noticed while fixing this that the parameter for the translation
was incorrect -- it was `group` instead of `groupNames`, so that
is fixed here too, along with moving the onShow functions into
@afterRender decorated private functions. There is no need for the
appevent listeners.
Previously, our `upload://` protocol urls were only supported in markdown image tags. This meant that our PullHotlinkedImages job was forced to convert `<img` tags to markdown. Depending on the exact syntax, this can actually cause the image to break.
This commit adds support for `upload://` inside regular HTML `<img` tags. In a future commit, we'll be able to use this to make our PullHotlinkedImages job much more robust.
Context at https://meta.discourse.org/t/152801
Since 6a5ef27, we made public
versions of some TextareaTextManipulation methods. This commit removes
the old underscore versions of these methods:
_focusTextArea
_insertBlock
_insertText
_getSelected
_selectText
_replaceText
_applySurround
_addText
_extractTable
_isInside
* FIX: Redirect if Discourse-Xhr-Redirect is present
`handleRedirect` was passed an wrong argument type (a string) instead of
a jqXHR object and missed the fields checked in condition, thus always
evaluating to `false`.
* FIX: Add `errors` field if group update confirmation
An explicit confirmation about the effect of the group update is
required if the default notification level changes. Previously, if the
confirmation was missing the API endpoint failed silently returning
a 200 response code and a `user_count` field. This change ensures that
a proper error code is returned (422), a descriptive error message and
the additional information in the `user_count` field.
This commit also refactors the API endpoint to use the
`Discourse-Xhr-Redirect` header to redirect the user if the group is
no longer visible.
Clicking the Replies cell of a topic in a topics list shows a little
modal with 2 buttons that take you to the first and last posts of the
topic. This modal is currently completely inaccessible to
keyboard/screen reader users because it can't be reached using the
keyboard.
This commit improves the modal so that it traps focus when it's shown
and makes it possible to close the modal using the esc key.
Topics lists like /latest are ordered by last activity date by default,
but the order can be changed (and reversed) to something else such as
replies count and views count by clicking on the corresponding column
header in the topics list. These column headers are tabbable, but screen
readers announce them as, using the replies column as example, `Replies
toggle button`. This doesn't communicate very well that this the button
changes the order, so this commit adds `aria-label`s to all column
headers to make it clear that they change order. The current copy for
the `aria-label` is `Sort by replies`.
When tabbing through a topics list like /latest, /unread, /new etc. the
Replies column is announced as `<replies count> button` by screen
readers and it's not clear that number means the topic has that number
of replies. This commit adds an `aria-label` so the Replies column to
make it clear what that number means. The current copy of the
`aria-label` is "This topic has <replies count> replies".
Follow-up to 97e7bb1ce4
Themes/plugins may override the default `topic-list-item` and remove the `.main-link` or `.title` elements from the template. We shouldn't attempt to focus them if they don't exist.
This option is being added because some composer derivatives
like the chat composer use ComposerUploadUppy, but do not
need the placeholder text for uploads to be inserted/replaced.
This way those components can set useUploadPlaceholders to
false to avoid it.
In the commit d678ba1103 we added
gif parsing support on paste, but we also slightly changed the
isComposer check there, along with a change in chat this caused
isComposer to be true (which is correct), however the event we fire
is composer:insert-text which the chat composer does not pick up.
Instead, we should use composerEventPrefix if it is present to
fire the insert-text event, and if it is not present (e.g. for
some custom composer that someone has implemented) fall back to
the default. There is a companion commit for chat to handle this
change there.
Follow-up to eb237e634a.
Some `{{topic-list}}` instances, like the one for suggested topics, opt out of focusing the row of the last visited topic in the list, but we currently still add listeners for focus/blur events even if when the topic-list instance opts out. This commit adds a check so that we only register focus/blur listeners if the topic-list opts in for last visited topic focus.
Another attempt at fixing https://meta.discourse.org/t/discourse-with-a-screen-reader/178105/88?u=osama. Previous PR (reverted): #16240.
The problems with the previous PR were:
1. As you scrolled down a topics list, the first topic of every new batch of topics would receive focus and the indicator would show up.
2. Similar to 1, clicking the `See X new or updated topics` notice would also focus a random topic from the new topics that were just loaded.
3. Topics in the suggested topics list received focus too
4. Our custom focus indicator appeared on mobile, but it shouldn't.
This commit should have none of these problems.
This reverts commit 5d77f485cb.
There are some edge cases that we need to handle better. Reverting this
commit because we're going to do a beta release later today.
