fix follow for contenteditable
This commit is contained in:
parent
10beccfab2
commit
4646e8b18d
3 changed files with 17 additions and 4 deletions
|
@ -4,6 +4,10 @@ import Hint from 'content/hint';
|
|||
import HintKeyProducer from 'content/hint-key-producer';
|
||||
|
||||
const DEFAULT_HINT_CHARSET = 'abcdefghijklmnopqrstuvwxyz';
|
||||
const TARGET_SELECTOR = [
|
||||
'a', 'button', 'input', 'textarea',
|
||||
'[contenteditable=true]', '[contenteditable=""]'
|
||||
].join(',');
|
||||
|
||||
const inWindow = (window, element) => {
|
||||
let {
|
||||
|
@ -130,6 +134,9 @@ export default class FollowComponent {
|
|||
return element.focus();
|
||||
case 'button':
|
||||
return element.click();
|
||||
default:
|
||||
// it may contenteditable
|
||||
return element.focus();
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -154,7 +161,7 @@ export default class FollowComponent {
|
|||
}
|
||||
|
||||
static getTargetElements(doc) {
|
||||
let all = doc.querySelectorAll('a,button,input,textarea');
|
||||
let all = doc.querySelectorAll(TARGET_SELECTOR);
|
||||
let filtered = Array.prototype.filter.call(all, (element) => {
|
||||
let style = window.getComputedStyle(element);
|
||||
return style.display !== 'none' &&
|
||||
|
|
|
@ -1,9 +1,12 @@
|
|||
<!DOCTYPE html>
|
||||
<html>
|
||||
<body>
|
||||
<a href='#' >link</a>
|
||||
<a id='visible_a' href='#' >link</a>
|
||||
<a href='#' style='display:none'>invisible 1</a>
|
||||
<a href='#' style='visibility:hidden'>invisible 2</a>
|
||||
<i>not link<i>
|
||||
<div id='editable_div_1' contenteditable>link</div>
|
||||
<div id='editable_div_2' contenteditable='true'>link</div>
|
||||
<div id='x' contenteditable='false'>link</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
|
@ -8,8 +8,11 @@ describe('FollowComponent', () => {
|
|||
});
|
||||
|
||||
it('returns visible links', () => {
|
||||
let links = FollowComponent.getTargetElements(window.document);
|
||||
expect(links).to.have.lengthOf(1);
|
||||
let targets = FollowComponent.getTargetElements(window.document);
|
||||
expect(targets).to.have.lengthOf(3);
|
||||
|
||||
let ids = Array.prototype.map.call(targets, (e) => e.id);
|
||||
expect(ids).to.include.members(['visible_a', 'editable_div_1', 'editable_div_2']);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
|
Reference in a new issue