Skip to content

Instantly share code, notes, and snippets.

Avatar
⚙️
Workin' on Chrome extensions!

Dave Stewart davestewart

⚙️
Workin' on Chrome extensions!
View GitHub Profile
@davestewart
davestewart / README.md
Last active Feb 3, 2021
Decompile JavaScript from source maps
View README.md

Decompile JavaScript from source maps

Overview

Modern JavaScript build tools compile entire folder structures of JavaScript code into single, minified files that are near-impossible to read, but can also include source maps which can be used to display the original code in tools such as the Chrome DevTools Sources panel.

These source maps can be processed to extract mainly meaningful code and file structures, by installing a package and running a simple bash command.

Generally, production builds shouldn't include source maps, but if you do manage to lose your source files, or for some (obviously, ethical!) reason need to view the original files, and you happen to have / find the source maps, you're good to go.

@davestewart
davestewart / babel.config.js
Created Dec 1, 2020
Target modern browsers only
View babel.config.js
module.exports = {
presets: [
[
'@vue/cli-plugin-babel/preset', // or any other preset, I guess
{
targets: {
chrome: '73',
node: '11'
}
}
@davestewart
davestewart / nuxt.config.js
Last active Dec 22, 2020
Nuxt build config to provide sane source maps and reliable HMR
View nuxt.config.js
// @see https://twitter.com/dave_stewart/status/1332340558069690371
// Special thanks to https://github.com/nicholasoxford
// YMMV!
module.exports = {
build: {
extend (config, { isDev, isClient }) {
if (isDev) {
// provides proper source and properly-named source map for pages and components
config.devtool = 'source-map'
@davestewart
davestewart / last-demo.js
Last active Oct 20, 2020
Modify a function so it only resolves the last call
View last-demo.js
// decorated search function
const search = last(function (query) {
return new Promise(function (resolve, reject) {
setTimeout(() => {
// randomly fail
Math.random() < .25
? reject(new Error('failed for query ' + query))
: resolve(String(query).toUpperCase())
}, Math.random() * 2000)
})
View facebook-stories-crazyfier.js
/**
* INSTRUCTIONS
*
* Video at: https://youtube.com/watch?v=AzSDmfDDijQ
*
* 1. copy the code below into a bookmark
* 2. go to https://www.facebook.com/stories/
* 3. click on a story
* 4. hit pause on one you like
* 5. find and run your bookmark
@davestewart
davestewart / decorators.ts
Last active May 12, 2020
TypeScript decorator to add Vue computed getters to a TypeScript class
View decorators.ts
import Vue from 'vue'
export function cached (target: Function) {
// get descriptors
const descriptors: any = Object.getOwnPropertyDescriptors(target.prototype)
const getters = Object
.keys(descriptors)
.filter(key => descriptors[key].get && !descriptors[key].set)
// we have getters!
@davestewart
davestewart / git extract feature with history.md
Last active Apr 25, 2020
Git: Extract feature to new repo, retaining history
View git extract feature with history.md

Git: Extract a feature to a new repo, retaining history

Abstract

I recently needed to extract a feature from a project to its own repo so I could publish as a standalone library:

# from
/some-project/src/some-folder/some-feature/*
@davestewart
davestewart / mixcloud.css
Created Apr 3, 2020
Mixcloud vertical playlist
View mixcloud.css
body {
padding-left: 400px;
}
div[class^=RebrandPlayerQueueItem__QueueItem] {
width: 400px;
}
div.player-height-placeholder div[class^=playerQueue__UpNextArea] {
z-index: 1000 !important;
@davestewart
davestewart / helpers.js
Last active Nov 26, 2019
Vue "route helpers" example
View helpers.js
/**
* Helper function to reduce boilerplate in route creation
*
* @param {string} path The route's path
* @param {object} page A page component definition
* @param {Function} page A function that returns a page import
* @param {string} page A string path to a file in the view/pages folder
* @param {object} attrs Any additional attributes
*/
export function route (path, page, attrs = {}) {
View table-factory-hooks.js
cells (row, col, name) {
if (!this.hot) {
return null
}
const rowData = this.hot.getSourceDataAtRow(row)
if (rowData) {
if (rowData.state === NegotiationItemState.removed) {
return { readOnly: true }
}