Skip to content

Instantly share code, notes, and snippets.

@cihad
cihad / get-xpath-for-element.js
Last active July 19, 2023 22:24
getXPathForElement
export function getXPathForElement(el, document) {
// not support that if el not existed in document yet(such as it not append to document before it mounted)
if (!document.contains(el)) {
return undefined;
}
let xpath = '';
let pos;
let tmpEle;
let element = el;
@cihad
cihad / downloadDirectoryAsZip.js
Last active May 13, 2023 23:03
Download S3 directory as .zip on Retool
const projectId = projectstable.selectedRow.data._id
const zip = new JSZip();
const { Contents } = await listObjectsFromS3.trigger({
additionalScope: {
projectId
}
});
@cihad
cihad / readme.md
Last active August 25, 2022 11:27
My Best React UI Frameworks
@cihad
cihad / webpack-output.txt
Last active May 10, 2022 14:56
browser-vite-demo errors
asset app.js 41.1 KiB [compared for emit] (name: app)
asset index.html 1000 bytes [compared for emit]
runtime modules 26.5 KiB 9 modules
./src/app/index.js 346 bytes [built] [code generated]
webpack 5.72.0 compiled successfully in 324 ms
assets by status 720 KiB [compared for emit]
assets by chunk 673 KiB (id hint: vendors)
asset vendors-node_modules_vue_compiler-dom_dist_compiler-dom_esm-bundler_js.js 279 KiB [compared for emit] (id hint: vendors)
asset vendors-node_modules_postcss-modules_build_index_js.js 260 KiB [compared for emit] (id hint: vendors)
@cihad
cihad / middleware.js
Created December 26, 2021 21:19
Javascript middleware pattern using promises, simple but powerfull
async function wrap(fn, thisCtx, ...ctx) {
return await new Promise(async (next, end) => {
next(await fn.call(thisCtx, ...ctx, next, end))
})
}
export class Middleware {
constructor(...middlewares) {
this.middlewares = middlewares
}
@cihad
cihad / get-media-type.js
Last active December 17, 2021 15:06
check file media type (mime) with javascript
function readBlob(blob) {
return new Promise((res, rej) => {
const reader = new FileReader()
reader.onloadend = function() {
res(reader.result)
}
reader.onerror = rej
reader.readAsDataURL(blob)
})
}
export default {
name: "my-sitatic-site",
children: [
{
name: "assets",
children: [
{
name: "images",
children: [
{
@cihad
cihad / readme.md
Created April 30, 2020 15:55
React to Vue
React Vue
useState data
useMemo data
useEffect (with no dependency array) mounted (once), beforeUpdate
useEffect (with dependency array) watch (immediate: true)
return function for useEffect destroyed
useCallback methods
useLayoutEffect
@cihad
cihad / typography.css
Created September 2, 2019 14:04
Github Markdown Body
.markdown-body {
font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol;
font-size: 16px;
line-height: 1.5;
word-wrap: break-word
}
.markdown-body:before {
content: "";
display: table
@cihad
cihad / output.js
Created July 9, 2019 16:17
$ vue-cli-service inspect
{
mode: 'development',
context: 'D:\\projects\\vue\\contentarchitect',
devtool: 'cheap-module-eval-source-map',
node: {
setImmediate: false,
dgram: 'empty',
fs: 'empty',
net: 'empty',
tls: 'empty',