Skip to content

Instantly share code, notes, and snippets.

Avatar
💭
"Fail faster"

Daniel Vivar jdvivar

💭
"Fail faster"
View GitHub Profile
@jdvivar
jdvivar / customElementDedupe.ts
Created Jun 2, 2021
Dedupe customElements definitions
View customElementDedupe.ts
export function customElementDedupe(): void {
const define: Function = window.customElements.define.bind(window.customElements);
window.customElements.define = (
name: string,
constructor: Function,
options: object,
): void => {
if (!window.customElements.get(name)) define(name, constructor, options);
};
}
@jdvivar
jdvivar / gist:40afcf8b0a68e22bbc9bbf3df60d5dd7
Created Oct 28, 2020
NPM script to remove 443 port from package-lock
View gist:40afcf8b0a68e22bbc9bbf3df60d5dd7
"remove-443": "sed -i '' 's/.net:443/.net/g' package-lock.json"
@jdvivar
jdvivar / pixel-anchor-observer.js
Last active Mar 8, 2020
Improved pixel anchor observer from
View pixel-anchor-observer.js
// Res.: https://css-tricks.com/styling-based-on-scroll-position/
let anchor = document.getElementById('pixel-anchor')
if (!anchor) {
const interval = window.setInterval(() => {
anchor = document.getElementById('pixel-anchor')
if (anchor) {
window.clearInterval(interval)
createObserver(anchor)
@jdvivar
jdvivar / webComponentStyleAddition.js
Last active Jan 24, 2020
Add style rules inside Web Components
View webComponentStyleAddition.js
// target is a web component with an open ShadowDOM
const target = document.querySelector(...)
target.shadowRoot.styleSheets[0].insertRule(`
selector {
padding: 8px;
}
`)
@jdvivar
jdvivar / waitThenDo.js
Last active Mar 25, 2020
Wait for an element to appear, then when it does, do something with it
View waitThenDo.js
const interval = window.setInterval(() => {
// Search target element
const target = document.querySelector(...)
if (target) {
window.clearInterval(interval)
// Do something with target element
target.innerText = 'Meow'
}
}, 100)
@jdvivar
jdvivar / findAnchorURLs.js
Last active Dec 10, 2019
Find all anchor URLs (including in web components' shadow root nodes)
View findAnchorURLs.js
function recursiveFindAnchors(node) {
if (!node) return []
// Find anchors URLs
const bareAnchorURLs = [...node.querySelectorAll('a')].map(anchor => formatHref(anchor.href))
// Find all shadow roots
const allShadowRoots = [...node.querySelectorAll('*')].filter(node => node.shadowRoot).map(node => node.shadowRoot)
// No web components in here
@jdvivar
jdvivar / sagepay.sh
Created Mar 22, 2018
Script to compile Sagepay XML/XSLT2 into HTML
View sagepay.sh
#!/usr/bin/env bash
# Sagepay templates script file
# Function to show help with the use of this script
help()
{
echo "compile Compiles XML/XSLT to HTML"
echo "bundle Create bundle to send to Sagepay"
echo "help Show this help"
echo ""
@jdvivar
jdvivar / compile_sagepay_templates.sh
Last active Mar 22, 2018
Excerpt of a script to compile Sagepay XML/XSLT2 into HTML
View compile_sagepay_templates.sh
#!/usr/bin/env bash
# This file is a excerpt of a bigger script
# Files lists, they should be matching
xml_list=(
'authorisation'
'card_authentication'
'card_details'
'error'