8912752932

Committed 01 May 2024 05:35PM UTC coverage: 95.927% (-0.1%) from 96.07%

Build # 8912752932

Build Type

Pull #38725

github

Committed by

web-flow

Commit Message

Merge 878b5969d into c8a865419

Pull Request Pull Request #38725: Fix this reference for functions

Run Details

664 of 726 branches covered (91.46%)

Branch coverage included in aggregate %.

3 of 3 new or added lines in 3 files covered. (100.0%)

2 existing lines in 2 files now uncovered.

2021 of 2073 relevant lines covered (97.49%)

192.49 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

90.91

/js/src/util/focustrap.js

/**
 * --------------------------------------------------------------------------
 * Bootstrap util/focustrap.js
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
 * --------------------------------------------------------------------------
 */

import EventHandler from '../dom/event-handler.js'
import SelectorEngine from '../dom/selector-engine.js'
import Config from './config.js'

/**
 * Constants
 */

const NAME = 'focustrap'
const DATA_KEY = 'bs.focustrap'
const EVENT_KEY = `.${DATA_KEY}`
const EVENT_FOCUSIN = `focusin${EVENT_KEY}`
const EVENT_KEYDOWN_TAB = `keydown.tab${EVENT_KEY}`

const TAB_KEY = 'Tab'
const TAB_NAV_FORWARD = 'forward'
const TAB_NAV_BACKWARD = 'backward'

const Default = {
  autofocus: true,
  trapElement: null // The element to trap focus inside of
}

const DefaultType = {
  autofocus: 'boolean',
  trapElement: 'element'
}

/**
 * Class definition
 */

class FocusTrap extends Config {
  constructor(config) {
    super()
    this._config = this._getConfig(config)
    this._isActive = false
    this._lastTabNavDirection = null
  }

  // Getters
  static get Default() {
    return Default
  }

  static get DefaultType() {
    return DefaultType
  }

  static get NAME() {
    return NAME
  }

  // Public
  activate() {
    if (this._isActive) {
      return
    }

    if (this._config.autofocus) {
      this._config.trapElement.focus()
    }

    EventHandler.off(document, EVENT_KEY) // guard against infinite focus loop
    EventHandler.on(document, EVENT_FOCUSIN, event => this._handleFocusin(event))
    EventHandler.on(document, EVENT_KEYDOWN_TAB, event => this._handleKeydown(event))

    this._isActive = true
  }

  deactivate() {
    if (!this._isActive) {
      return
    }

    this._isActive = false
    EventHandler.off(document, EVENT_KEY)
  }

  // Private
  _handleFocusin(event) {
    const { trapElement } = this._config

    if (event.target === document || event.target === trapElement || trapElement.contains(event.target)) {
      return
    }

    const elements = SelectorEngine.focusableChildren(trapElement)

    if (elements.length === 0) {
      trapElement.focus()
    } else if (this._lastTabNavDirection === TAB_NAV_BACKWARD) {
      elements[elements.length - 1].focus()
    } else {
      elements[0].focus()
    }
  }

  _handleKeydown(event) {
    if (event.key !== TAB_KEY) {
      return
    }

    this._lastTabNavDirection = event.shiftKey ? TAB_NAV_BACKWARD : TAB_NAV_FORWARD
  }
}

export default FocusTrap

1	/**
2	* --------------------------------------------------------------------------
3	* Bootstrap util/focustrap.js
4	* Licensed under MIT (https://github.com/twbs/bootstrap/blob/main/LICENSE)
5	* --------------------------------------------------------------------------
6	*/
7
8	import EventHandler from '../dom/event-handler.js'
9	import SelectorEngine from '../dom/selector-engine.js'
10	import Config from './config.js'
11
12	/**
13	* Constants
14	*/
15
16	const NAME = 'focustrap'	3✔
17	const DATA_KEY = 'bs.focustrap'	3✔
18	const EVENT_KEY = `.${DATA_KEY}`	3✔
19	const EVENT_FOCUSIN = `focusin${EVENT_KEY}`	3✔
20	const EVENT_KEYDOWN_TAB = `keydown.tab${EVENT_KEY}`	3✔
21
22	const TAB_KEY = 'Tab'	3✔
23	const TAB_NAV_FORWARD = 'forward'	3✔
24	const TAB_NAV_BACKWARD = 'backward'	3✔
25
26	const Default = {	3✔
27	autofocus: true,
28	trapElement: null // The element to trap focus inside of
29	}
30
31	const DefaultType = {	3✔
32	autofocus: 'boolean',
33	trapElement: 'element'
34	}
35
36	/**
37	* Class definition
38	*/
39
40	class FocusTrap extends Config {
41	constructor(config) {
42	super()	113✔
43	this._config = this._getConfig(config)	113✔
44	this._isActive = false	113✔
45	this._lastTabNavDirection = null	113✔
46	}
47
48	// Getters
49	static get Default() {
50	return Default	113✔
51	}
52
53	static get DefaultType() {
54	return DefaultType	113✔
55	}
56
57	static get NAME() {
58	return NAME	×
59	}
60
61	// Public
62	activate() {
63	if (this._isActive) {	67!
64	return	×
65	}
66
67	if (this._config.autofocus) {	67✔
68	this._config.trapElement.focus()	66✔
69	}
70
71	EventHandler.off(document, EVENT_KEY) // guard against infinite focus loop	67✔
72	EventHandler.on(document, EVENT_FOCUSIN, event => this._handleFocusin(event))	67✔
73	EventHandler.on(document, EVENT_KEYDOWN_TAB, event => this._handleKeydown(event))	67✔
74
75	this._isActive = true	67✔
76	}
77
78	deactivate() {
79	if (!this._isActive) {	28✔
80	return	5✔
81	}
82
83	this._isActive = false	23✔
84	EventHandler.off(document, EVENT_KEY)	23✔
85	}
86
87	// Private
88	_handleFocusin(event) {
89	const { trapElement } = this._config	9✔
90
91	if (event.target === document \|\| event.target === trapElement \|\| trapElement.contains(event.target)) {	9✔
92	return	2✔
93	}
94
95	const elements = SelectorEngine.focusableChildren(trapElement)	7✔
96
97	if (elements.length === 0) {	7✔
98	trapElement.focus()	4✔
99	} else if (this._lastTabNavDirection === TAB_NAV_BACKWARD) {	3✔
100	elements[elements.length - 1].focus()	1✔
101	} else {
102	elements[0].focus()	2✔
103	}
104	}
105
106	_handleKeydown(event) {
107	if (event.key !== TAB_KEY) {	2!
UNCOV 108	return	×
109	}
110
111	this._lastTabNavDirection = event.shiftKey ? TAB_NAV_BACKWARD : TAB_NAV_FORWARD	2✔
112	}
113	}
114
115	export default FocusTrap

twbs / bootstrap / 8912752932

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous