Skip to content

Commit fc0eb7d

Browse files
TarekRaafatTarekRaafat
committed
v8.3.2 => Release Notes for details
1 parent a38a0e3 commit fc0eb7d

File tree

10 files changed

+31
-32
lines changed

10 files changed

+31
-32
lines changed

‎README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -54,13 +54,13 @@ git clone https://github.com/TarekRaafat/autoComplete.js.git
5454
`CSS`
5555

5656
```html
57-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.1/dist/css/autoComplete.min.css">
57+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.2/dist/css/autoComplete.min.css">
5858
```
5959

6060
`JS`
6161

6262
```html
63-
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.1/dist/js/autoComplete.min.js"></script>
63+
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.2/dist/js/autoComplete.min.js"></script>
6464
```
6565

6666
- <a href="https://www.npmjs.com/package/@tarekraafat/autocomplete.js">npm</a> install `(Node Package Manager)`

‎dist/js/autoComplete.js

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -485,6 +485,7 @@
485485
this.highlight = highlight;
486486
this.feedback = feedback;
487487
this.onSelection = onSelection;
488+
this.inputField = typeof this.selector === "string" ? document.querySelector(this.selector) : this.selector();
488489
this.observer ? this.preInit() : this.init();
489490
}
490491
_createClass(autoComplete, [{
@@ -562,7 +563,6 @@
562563
key: "init",
563564
value: function init() {
564565
var _this4 = this;
565-
this.inputField = typeof this.selector === "string" ? document.querySelector(this.selector) : this.selector();
566566
inputComponent(this);
567567
if (this.placeHolder) this.inputField.setAttribute("placeholder", this.placeHolder);
568568
this.hook = debouncer(function () {
@@ -578,21 +578,19 @@
578578
key: "preInit",
579579
value: function preInit() {
580580
var _this5 = this;
581-
var targetNode = document;
582581
var config = {
583582
childList: true,
584583
subtree: true
585584
};
586585
var callback = function callback(mutationsList, observer) {
587-
var inputField = targetNode.querySelector(_this5.selector);
588586
var _iterator = _createForOfIteratorHelper(mutationsList),
589587
_step;
590588
try {
591589
for (_iterator.s(); !(_step = _iterator.n()).done;) {
592590
var mutation = _step.value;
593-
if (inputField) {
591+
if (_this5.inputField) {
594592
observer.disconnect();
595-
eventEmitter(inputField, null, "connect");
593+
eventEmitter(_this5.inputField, null, "connect");
596594
_this5.init();
597595
}
598596
}
@@ -603,7 +601,7 @@
603601
}
604602
};
605603
var observer = new MutationObserver(callback);
606-
observer.observe(targetNode, config);
604+
observer.observe(document, config);
607605
}
608606
}, {
609607
key: "unInit",

‎dist/js/autoComplete.js.gz

-26 Bytes
Binary file not shown.

‎dist/js/autoComplete.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/js/autoComplete.min.js.gz

4 Bytes
Binary file not shown.

‎docs/README.md

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -69,41 +69,41 @@ npm run build
6969
`CSS`
7070

7171
```html
72-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.1/dist/css/autoComplete.min.css">
72+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.2/dist/css/autoComplete.min.css">
7373
```
7474

7575
`JS`
7676

7777
```html
78-
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.1/dist/js/autoComplete.min.js"></script>
78+
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.2/dist/js/autoComplete.min.js"></script>
7979
```
8080

8181
- <a href="https://cdnjs.com/libraries/tarekraafat-autocomplete.js"><img src="./img/logos/cdnjs_logo.png" alt="cdnjs Logo" width="100px"></a> CDN
8282

8383
`CSS`
8484

8585
```html
86-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tarekraafat-autocomplete.js/8.3.1/css/autoComplete.min.css">
86+
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/tarekraafat-autocomplete.js/8.3.2/css/autoComplete.min.css">
8787
```
8888

8989
`JS`
9090

9191
```html
92-
<script src="https://cdnjs.cloudflare.com/ajax/libs/tarekraafat-autocomplete.js/8.3.1/js/autoComplete.min.js"></script>
92+
<script src="https://cdnjs.cloudflare.com/ajax/libs/tarekraafat-autocomplete.js/8.3.2/js/autoComplete.min.js"></script>
9393
```
9494

95-
- <a href="https://unpkg.com/browse/@tarekraafat/autocomplete.js@8.3.1/"><img src="./img/logos/unpkg_logo.png" alt="unpkg Logo" width="100px"></a> CDN
95+
- <a href="https://unpkg.com/browse/@tarekraafat/autocomplete.js@8.3.2/"><img src="./img/logos/unpkg_logo.png" alt="unpkg Logo" width="100px"></a> CDN
9696

9797
`CSS`
9898

9999
```html
100-
<link rel="stylesheet" href="https://unpkg.com/@tarekraafat/autocomplete.js@8.3.1/dist/css/autoComplete.css">
100+
<link rel="stylesheet" href="https://unpkg.com/@tarekraafat/autocomplete.js@8.3.2/dist/css/autoComplete.css">
101101
```
102102

103103
`JS`
104104

105105
```html
106-
<script src="https://unpkg.com/@tarekraafat/autocomplete.js@8.3.1/dist/js/autoComplete.min.js"></script>
106+
<script src="https://unpkg.com/@tarekraafat/autocomplete.js@8.3.2/dist/js/autoComplete.min.js"></script>
107107
```
108108

109109
- <img src="./img/logos/html_logo.png" alt="HTML Logo" width="40px"> HTML Local load
@@ -151,7 +151,7 @@ const autoComplete = require("@tarekraafat/autocomplete.js/dist/js/autoComplete"
151151
```html
152152
<link rel="stylesheet" href="./css/autoComplete.css">
153153
OR
154-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.1/dist/css/autoComplete.min.css">
154+
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.2/dist/css/autoComplete.min.css">
155155
```
156156

157157
2. Assign the default `id` value `"autoComplete"` to the desired input field or use any custom `id/class` and configure the API selector accordingly in `Step 4`
@@ -166,7 +166,7 @@ OR
166166
<script src="./js/autoComplete.min.js"></script>
167167
<script src="./js/index.js"></script>
168168
OR
169-
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.1/dist/js/autoComplete.min.js"></script>
169+
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.2/dist/js/autoComplete.min.js"></script>
170170
<script src="./js/index.js"></script>
171171
```
172172

‎docs/demo/index.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@
7272
<meta name="msapplication-TileImage" content="/ms-icon-144x144.png">
7373
<meta name="theme-color" content="#ffffff">
7474
<link rel="stylesheet" type="text/css" media="screen"
75-
href="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.1/dist/css/autoComplete.min.css">
75+
href="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.2/dist/css/autoComplete.min.css">
7676
<link rel="stylesheet" type="text/css" media="screen" href="./css/main.css">
7777
<link href="https://fonts.googleapis.com/css?family=PT+Sans" rel="stylesheet">
7878
</head>
@@ -151,7 +151,7 @@ <h4>mode</h4>
151151
</div>
152152
</footer>
153153
</div>
154-
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.1/dist/js/autoComplete.min.js"></script>
154+
<script src="https://cdn.jsdelivr.net/npm/@tarekraafat/autocomplete.js@8.3.2/dist/js/autoComplete.min.js"></script>
155155
<script src="./js/index.js"></script>
156156
</body>
157157

‎docs/releases.md

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,10 @@ Release flags:
2626

2727
## Release Notes
2828

29-
- v8.3.1 ✨
29+
- v8.3.2 ✨
30+
- 🔧 Fix: `selector` as a function breaks when `observer` is true (Thanks 👍 @brunobg) #179
31+
32+
- v8.3.1
3033
- 🔧 Fix: Keyboard navigation selection reset (Thanks 👍 @marsimeau) #177
3134

3235
- v8.3.0

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@tarekraafat/autocomplete.js",
3-
"version": "8.3.1",
3+
"version": "8.3.2",
44
"description": "Simple autocomplete pure vanilla Javascript library.",
55
"keywords": [
66
"simple",

‎src/autoComplete.js

Lines changed: 8 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,7 @@ import eventEmitter from "./utils/eventEmitter";
1212

1313
/**
1414
* @desc This is autoComplete.js
15-
* @version 8.2.0
15+
* @version 8.3.2
1616
* @example let autoCompleteJS = new autoComplete({config});
1717
*/
1818
export default class autoComplete {
@@ -106,7 +106,9 @@ export default class autoComplete {
106106
this.highlight = highlight;
107107
this.feedback = feedback;
108108
this.onSelection = onSelection;
109-
// Invoking preInit if enabled
109+
// Assign the input field selector
110+
this.inputField = typeof this.selector === "string" ? document.querySelector(this.selector) : this.selector();
111+
// Invoke preInit if enabled
110112
// or initiate autoComplete instance directly
111113
this.observer ? this.preInit() : this.init();
112114
}
@@ -182,8 +184,6 @@ export default class autoComplete {
182184

183185
// Initialization stage
184186
init() {
185-
// Assign the input field selector
186-
this.inputField = typeof this.selector === "string" ? document.querySelector(this.selector) : this.selector();
187187
// Set input field attributes
188188
inputComponent(this);
189189
// Set placeholder attribute value
@@ -209,23 +209,20 @@ export default class autoComplete {
209209
// Pre-Initialization stage
210210
preInit() {
211211
// Observe DOM changes
212-
// The entire document will be observed for mutations
213-
const targetNode = document;
214212
// Options for the observer (which mutations to observe)
215213
const config = { childList: true, subtree: true };
216214
// Callback function to execute when mutations are observed
217215
const callback = (mutationsList, observer) => {
218-
const inputField = targetNode.querySelector(this.selector);
219216
// Traditional 'for loops' for IE 11
220217
for (let mutation of mutationsList) {
221218
// Check if this is the selected input field
222-
if (inputField) {
219+
if (this.inputField) {
223220
// If yes disconnect the observer
224221
observer.disconnect();
225222
/**
226223
* @emits {connect} Emits Event on connection
227224
**/
228-
eventEmitter(inputField, null, "connect");
225+
eventEmitter(this.inputField, null, "connect");
229226
// Initialize autoComplete
230227
this.init();
231228
}
@@ -234,7 +231,8 @@ export default class autoComplete {
234231
// Create an observer instance linked to the callback function
235232
const observer = new MutationObserver(callback);
236233
// Start observing the target node for configured mutations
237-
observer.observe(targetNode, config);
234+
// The entire document will be observed for mutations
235+
observer.observe(document, config);
238236
}
239237

240238
// Un-initialize autoComplete

0 commit comments

Comments
 (0)