Bump AvalynxAlert to version 1.0.3

jschwind · jschwind · commit 30c8d56d4d3b · 2025-10-05T13:59:03.000+02:00
Upgrade references to version 1.0.3 across files, enhance `avalynx-alert.js` and its ESM counterpart for better modularity, and expand Jest tests for comprehensive functionality coverage.
diff --git a/README.md b/README.md
@@ -47,8 +47,8 @@ Replace `path/to/avalynx-alert.js` and `path/to/avalynx-alert.css` with the actu
 AvalynxAlert is also available via [jsDelivr](https://www.jsdelivr.com/). You can include it in your project like this:
 
 ```html
-<link href="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.2/dist/css/avalynx-alert.css" rel="stylesheet">
-<script src="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.2/dist/js/avalynx-alert.js"></script>
+<link href="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.3/dist/css/avalynx-alert.css" rel="stylesheet">
+<script src="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.3/dist/js/avalynx-alert.js"></script>
 ```
 
 Make sure to also include Bootstrap's JS/CSS in your project to ensure AvalynxAlert displays correctly.
diff --git a/__tests__/avalynx-loader.test.js b/__tests__/avalynx-loader.test.js
diff --git a/build.js b/build.js
@@ -18,7 +18,9 @@ fs.readFile(filePath, 'utf8', (err, data) => {
         return;
     }
 
-    const result = data.replace(/class /g, 'export class ');
+    let result = data.replace(/class AvalynxAlert /g, 'import * as bootstrap from \'bootstrap\';\n\nexport class AvalynxAlert ');
+
+    result = result.replace(/\n\nif \(typeof module !== 'undefined' && module\.exports\) \{\n    module\.exports = AvalynxAlert;\n\}\n?$/, '');
 
     fs.writeFile(filePath, result, 'utf8', err => {
         if (err) {
diff --git a/dist/js/avalynx-alert.esm.js b/dist/js/avalynx-alert.esm.js
@@ -22,8 +22,13 @@
  *
  */
 
+import * as bootstrap from 'bootstrap';
+
 export class AvalynxAlert {
     constructor(message, type, options = {}) {
+        if (options === null || typeof options !== 'object') {
+            options = {};
+        }
         this.message = message;
         this.type = type;
         this.options = {
@@ -105,7 +110,6 @@ export class AvalynxAlert {
         alert.classList.add('p-0');
         alert.classList.add('overflow-hidden');
         alert.classList.add('avalynx-alert');
-        alert.role = 'alert';
         alert.innerHTML = `<div class="alert-content">${this.message}`;
         if (this.options.closeable) {
             alert.innerHTML += `<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>`;
@@ -114,6 +118,7 @@ export class AvalynxAlert {
         if (this.options.autoClose) {
             alert.innerHTML += `<div class="alert-timer" style="height: 5px; width: 0;"></div>`;
         }
+        alert.setAttribute('role', 'alert');
 
         document.getElementById('avalynx-alert-container-' + this.options.position).appendChild(alert);
 
@@ -138,4 +143,4 @@ export class AvalynxAlert {
             }, this.options.duration);
         }
     }
-}
+}
diff --git a/dist/js/avalynx-alert.js b/dist/js/avalynx-alert.js
@@ -24,6 +24,9 @@
 
 class AvalynxAlert {
     constructor(message, type, options = {}) {
+        if (options === null || typeof options !== 'object') {
+            options = {};
+        }
         this.message = message;
         this.type = type;
         this.options = {
@@ -105,7 +108,6 @@ class AvalynxAlert {
         alert.classList.add('p-0');
         alert.classList.add('overflow-hidden');
         alert.classList.add('avalynx-alert');
-        alert.role = 'alert';
         alert.innerHTML = `<div class="alert-content">${this.message}`;
         if (this.options.closeable) {
             alert.innerHTML += `<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>`;
@@ -114,6 +116,7 @@ class AvalynxAlert {
         if (this.options.autoClose) {
             alert.innerHTML += `<div class="alert-timer" style="height: 5px; width: 0;"></div>`;
         }
+        alert.setAttribute('role', 'alert');
 
         document.getElementById('avalynx-alert-container-' + this.options.position).appendChild(alert);
 
@@ -139,3 +142,7 @@ class AvalynxAlert {
         }
     }
 }
+
+if (typeof module !== 'undefined' && module.exports) {
+    module.exports = AvalynxAlert;
+}
diff --git a/docker/web/Dockerfile b/docker/web/Dockerfile
@@ -1,4 +1,21 @@
-FROM webdevops/php-apache-dev:8.1
+FROM webdevops/php-apache-dev:8.3
 
 # Update and install
 RUN apt-get update && apt-get install -y
+
+#Nano
+RUN apt-get install -y nano
+
+#Keyring
+RUN mkdir -p /etc/apt/keyrings
+
+# Node.js
+RUN curl -fsSL https://deb.nodesource.com/gpgkey/nodesource-repo.gpg.key | gpg --dearmor -o /etc/apt/keyrings/nodesource.gpg
+RUN NODE_MAJOR=18 && echo "deb [signed-by=/etc/apt/keyrings/nodesource.gpg] https://deb.nodesource.com/node_$NODE_MAJOR.x nodistro main" | tee /etc/apt/sources.list.d/nodesource.list
+
+# Yarn
+RUN curl -sL https://dl.yarnpkg.com/debian/pubkey.gpg | gpg --dearmor |  tee /usr/share/keyrings/yarnkey.gpg >/dev/null 2>&1
+RUN echo "deb [signed-by=/usr/share/keyrings/yarnkey.gpg] https://dl.yarnpkg.com/debian stable main" |  tee /etc/apt/sources.list.d/yarn.list >/dev/null 2>&1
+RUN apt-get update && apt-get install -y yarn
+
+USER application
diff --git a/examples/callback-onclose.html b/examples/callback-onclose.html
@@ -16,9 +16,9 @@
 	<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.9/build/styles/stackoverflow-light.min.css" id="hljsTheme">
 	<script>hljs.highlightAll();</script>
 
-	<!-- AvalynxAlert 1.0.2 -->
-    <link href="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.2/dist/css/avalynx-alert.min.css" rel="stylesheet">
-    <script src="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.2/dist/js/avalynx-alert.min.js"></script>
+	<!-- AvalynxAlert 1.0.3 -->
+    <link href="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.3/dist/css/avalynx-alert.min.css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.3/dist/js/avalynx-alert.min.js"></script>
 
 	<!-- Example helper -->
 	<link href="./css/helper.css" rel="stylesheet">
diff --git a/examples/random-alerts-every-3s.html b/examples/random-alerts-every-3s.html
@@ -16,9 +16,9 @@
 	<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.9/build/styles/stackoverflow-light.min.css" id="hljsTheme">
 	<script>hljs.highlightAll();</script>
 
-	<!-- AvalynxAlert 1.0.2 -->
-    <link href="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.2/dist/css/avalynx-alert.min.css" rel="stylesheet">
-    <script src="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.2/dist/js/avalynx-alert.min.js"></script>
+	<!-- AvalynxAlert 1.0.3 -->
+    <link href="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.3/dist/css/avalynx-alert.min.css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.3/dist/js/avalynx-alert.min.js"></script>
 
 	<!-- Example helper -->
 	<link href="./css/helper.css" rel="stylesheet">
diff --git a/examples/random-alerts.html b/examples/random-alerts.html
@@ -16,9 +16,9 @@
 	<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.9/build/styles/stackoverflow-light.min.css" id="hljsTheme">
 	<script>hljs.highlightAll();</script>
 
-	<!-- AvalynxAlert 1.0.2 -->
-    <link href="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.2/dist/css/avalynx-alert.min.css" rel="stylesheet">
-    <script src="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.2/dist/js/avalynx-alert.min.js"></script>
+	<!-- AvalynxAlert 1.0.3 -->
+    <link href="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.3/dist/css/avalynx-alert.min.css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.3/dist/js/avalynx-alert.min.js"></script>
 
 	<!-- Example helper -->
 	<link href="./css/helper.css" rel="stylesheet">
diff --git a/examples/simple-alert.html b/examples/simple-alert.html
@@ -16,9 +16,9 @@
 	<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.9/build/styles/stackoverflow-light.min.css" id="hljsTheme">
 	<script>hljs.highlightAll();</script>
 
-	<!-- AvalynxAlert 1.0.2 -->
-    <link href="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.2/dist/css/avalynx-alert.min.css" rel="stylesheet">
-    <script src="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.2/dist/js/avalynx-alert.min.js"></script>
+	<!-- AvalynxAlert 1.0.3 -->
+    <link href="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.3/dist/css/avalynx-alert.min.css" rel="stylesheet">
+    <script src="https://cdn.jsdelivr.net/npm/avalynx-alert@1.0.3/dist/js/avalynx-alert.min.js"></script>
 
 	<!-- Example helper -->
 	<link href="./css/helper.css" rel="stylesheet">
diff --git a/package.json b/package.json
@@ -2,7 +2,7 @@
   "name": "avalynx-alert",
   "title": "AvalynxAlert",
   "description": "AvalynxAlert is a simple alert system for web applications. Based on Bootstrap >=5.3 without any framework dependencies.",
-  "version": "1.0.2",
+  "version": "1.0.3",
   "license": "MIT",
   "main": "dist/js/avalynx-alert.js",
   "module": "dist/js/avalynx-alert.esm.js",
diff --git a/src/css/avalynx-alert.css b/src/css/avalynx-alert.css
@@ -3,7 +3,7 @@
  *
  * A simple alert system for web applications. Based on Bootstrap >=5.3 without any framework dependencies.
  *
- * @version 1.0.2
+ * @version 1.0.3
  * @license MIT
  * @author https://github.com/avalynx/avalynx-alert/graphs/contributors
  * @website https://github.com/avalynx/
diff --git a/src/js/avalynx-alert.js b/src/js/avalynx-alert.js
@@ -3,7 +3,7 @@
  *
  * A simple alert system for web applications. Based on Bootstrap >=5.3 without any framework dependencies.
  *
- * @version 1.0.2
+ * @version 1.0.3
  * @license MIT
  * @author https://github.com/avalynx/avalynx-alert/graphs/contributors
  * @website https://github.com/avalynx/
@@ -24,6 +24,9 @@
 
 class AvalynxAlert {
     constructor(message, type, options = {}) {
+        if (options === null || typeof options !== 'object') {
+            options = {};
+        }
         this.message = message;
         this.type = type;
         this.options = {
@@ -105,7 +108,6 @@ class AvalynxAlert {
         alert.classList.add('p-0');
         alert.classList.add('overflow-hidden');
         alert.classList.add('avalynx-alert');
-        alert.role = 'alert';
         alert.innerHTML = `<div class="alert-content">${this.message}`;
         if (this.options.closeable) {
             alert.innerHTML += `<button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>`;
@@ -114,6 +116,7 @@ class AvalynxAlert {
         if (this.options.autoClose) {
             alert.innerHTML += `<div class="alert-timer" style="height: 5px; width: 0;"></div>`;
         }
+        alert.setAttribute('role', 'alert');
 
         document.getElementById('avalynx-alert-container-' + this.options.position).appendChild(alert);
 
@@ -139,3 +142,7 @@ class AvalynxAlert {
         }
     }
 }
+
+if (typeof module !== 'undefined' && module.exports) {
+    module.exports = AvalynxAlert;
+}

Original file line number	Diff line number	Diff line change
`@@ -18,7 +18,9 @@ fs.readFile(filePath, 'utf8', (err, data) => {`
`18`	`18`	`return;`
`19`	`19`	`}`
`20`	`20`
`21`		`- const result = data.replace(/class /g, 'export class ');`
	`21`	`+ let result = data.replace(/class AvalynxAlert /g, 'import * as bootstrap from \'bootstrap\';\n\nexport class AvalynxAlert ');`
	`22`	`+`
	`23`	`+ result = result.replace(/\n\nif \(typeof module !== 'undefined' && module\.exports\) \{\n module\.exports = AvalynxAlert;\n\}\n?$/, '');`
`22`	`24`
`23`	`25`	`fs.writeFile(filePath, result, 'utf8', err => {`
`24`	`26`	`if (err) {`