diff options
Diffstat (limited to 'www/test/1.8.6/src/htmx.test.ts')
-rw-r--r-- | www/test/1.8.6/src/htmx.test.ts | 96 |
1 files changed, 96 insertions, 0 deletions
diff --git a/www/test/1.8.6/src/htmx.test.ts b/www/test/1.8.6/src/htmx.test.ts new file mode 100644 index 00000000..71ed2d2b --- /dev/null +++ b/www/test/1.8.6/src/htmx.test.ts @@ -0,0 +1,96 @@ +import htmx from "./htmx"; + +// add the class 'myClass' to the element with the id 'demo' +htmx.addClass(htmx.find("#demo"), "myClass"); + +// issue a GET to /example and put the response HTML into #myDiv +htmx.ajax("GET", "/example", "#myDiv"); + +// find the closest enclosing div of the element with the id 'demo' +htmx.closest(htmx.find("#demo"), "div"); + +// update the history cache size to 30 +htmx.config.historyCacheSize = 30; + +// override SSE event sources to not use credentials +htmx.createEventSource = function (url) { + return new EventSource(url, { withCredentials: false }); +}; + +// override WebSocket to use a specific protocol +htmx.createWebSocket = function (url) { + return new WebSocket(url, ["wss"]); +}; + +// defines a silly extension that just logs the name of all events triggered +htmx.defineExtension("silly", { + onEvent: function (name, evt) { + console.log("Event " + name + " was triggered!"); + } +}); + +// find div with id my-div +var div = htmx.find("#my-div"); + +// find div with id another-div within that div +var anotherDiv = htmx.find(div, "#another-div"); + +// find all divs +var allDivs = htmx.findAll("div"); + +// find all paragraphs within a given div +var allParagraphsInMyDiv = htmx.findAll(htmx.find("#my-div"), "p"); + +htmx.logAll(); + +// remove this click listener from the body +htmx.off("click", myEventListener); + +// remove this click listener from the given div +htmx.off("#my-div", "click", myEventListener); + +// add a click listener to the body +var myEventListener = htmx.on("click", function (evt) { + console.log(evt); +}); + +// add a click listener to the given div +var myEventListener = htmx.on("#my-div", "click", function (evt) { + console.log(evt); +}); + +const MyLibrary: any = null; + +htmx.onLoad(function (elt) { + MyLibrary.init(elt); +}); + +// returns 3000 +var milliseconds = htmx.parseInterval("3s"); + +// returns 3 - Caution +var milliseconds = htmx.parseInterval("3m"); + +document.body.innerHTML = "<div hx-get='/example'>Get it!</div>"; +// process the newly added content +htmx.process(document.body); + +// removes my-div from the DOM +htmx.remove(htmx.find("#my-div")); + +// removes .myClass from my-div +htmx.removeClass(htmx.find("#my-div"), "myClass"); + +htmx.removeExtension("my-extension"); + +// takes the selected class from tab2"s siblings +htmx.takeClass(htmx.find("#tab2"), "selected"); + +// toggles the selected class on tab2 +htmx.toggleClass(htmx.find("#tab2"), "selected"); + +// triggers the myEvent event on #tab2 with the answer 42 +htmx.trigger(htmx.find("#tab2"), "myEvent", { answer: 42 }); + +// gets the values associated with this form +var values = htmx.values(htmx.find("#myForm")); |