Ghost/ghost/admin/app/components/gh-skip-link.js
Kevin Ansfield 73daa80b7f Migrate to latest ember, ember-mocha and modern ember testing (#1044)
no issue
- upgrade to latest `ember-source` and related dependencies including `ember-cli`
- upgrade to latest `ember-mocha` and modern ember testing setup
    - https://github.com/emberjs/rfcs/blob/master/text/0268-acceptance-testing-refactor.md
    - switch from using global acceptance test helpers and `native-dom-helpers` to using the new `ember-test-helpers` methods
    - use [`chai-dom`](https://github.com/nathanboktae/chai-dom) assertions where in some places (still a lot of places in the tests that could use these)
- pin `ember-in-viewport` to 3.0.x to work around incompatibilities between different versions used in `ember-light-table`, `ember-infinity`, and `ember-sticky-element`
    - incompatibilities manifested as "Invalid value used as weak map key" errors thrown when using `ember-light-table` (subscribers screen)
- pin `ember-power-datepicker` to unreleased version that contains a move from global acceptance test helpers to modern test helpers
2019-01-02 09:58:55 +00:00

39 lines
1.3 KiB
JavaScript

import Component from '@ember/component';
import {htmlSafe} from '@ember/string';
export default Component.extend({
tagName: 'a',
anchor: '',
classNames: ['sr-only', 'sr-only-focusable'],
// Add attributes to component for href
// href should be set to retain anchor properties
// such as pointer cursor and text underline
attributeBindings: ['href'],
// Used so that upon clicking on the link
// anchor behaviors or ignored
href: htmlSafe('javascript:;'),
click() {
let el = document.querySelector(this.anchor);
if (el) {
// Scrolls to the top of main content or whatever
// is passed to the anchor attribute
document.body.scrollTop = el.getBoundingClientRect().top;
let removeTabindex = function () {
el.removeAttribute('tabindex');
};
// This sets focus on the content which was skipped to
// upon losing focus, the tabindex should be removed
// so that normal keyboard navigation picks up from focused
// element
el.setAttribute('tabindex', -1);
el.focus();
el.addEventListener('blur', removeTabindex);
el.addEventListener('focusout', removeTabindex);
}
}
});