Skip to content

Instantly share code, notes, and snippets.

/*
* bug 814641 - [toolbox] Panels appear behind the devtools window after undocking
* STR:
* Run this browser scratchpad.
* click on "open". You see an arrow panel.
* Move your mouse over it, see the spinning cursor.
* click swap to swap the frames.
* click on "open". You do _NOT_ see the panel.
* Move your mouse where it should have appeared. See the spinning cursor.
*/
@bkimmelSQSP
bkimmelSQSP / snippet.js
Created September 16, 2021 05:20
Transfers to LocalCache from a Common (iframe) cache
const urlToStoreInCommonCache = `https://assets.squarespace.com/universal/scripts-compressed/config-vendors-b6b69075bd69ac75a13bd-min.en-US.js`;
caches.match(urlToStoreInCommonCache).then((response)=>{
if(!response){
window.addEventListener('message', (msg)=>{
if(msg.data === 'common cache ready'){
console.log('COMMON CACHE READY');
const cachePort = msg.ports[0];
cachePort.onmessage = (cachedArrayBuffer)=>{
const resp = new Response(cachedArrayBuffer);
caches.open('zany-cache').then((cache)=>{
@bkimmelSQSP
bkimmelSQSP / renderJSON.js
Last active May 17, 2024 01:33
Final Answer
const converted = Symbol('object was alrady converted');
function renderJSON(configObject) {
const handler = {
get(target, prop, receiver) {
Reflect.defineProperty(receiver, converted, {value: true, enumerable: false, writable: false, configurable: false});
if (prop === "toJSON") {
for (const ownKey of Reflect.ownKeys(target)) {
const val = Reflect.get(target, ownKey);
const invariantCheck = Reflect.getOwnPropertyDescriptor(target, ownKey);
if(invariantCheck.writable === false || invariantCheck.configurable === false){
function theProblem({methodName, regExpString, propertyName}={}) {
//NO EDITING THIS
var result = RegExp.prototype[methodName].bind(new RegExp(regExpString,'g'))('abcabcissquarespace')[propertyName];
function throwOnAssert(...args) {
const [condition, message] = args;
console.assert(condition,message);
if(!condition){
throw new Error(`Failed assertion: ${message}`);
}
@bkimmelSQSP
bkimmelSQSP / FEF_ConsoleTricks.js
Last active May 17, 2024 01:31
Console Tricks
function sqspLogoLog() {
//Did you know?: You can put pretty pictures/links/etc. in `.log`s
// ... log/info (same on Chrome) have specifiers
// ... most of them aren't that exciting since ES6 string templating
// ... BUT: %c
console.info(
'%c %cSquarespace Frontend Handbook%chttps://frontend.squarespace.net%c \n%c2024.02.07%c %c037a8af9746',
'padding-left: 30px; line-height: 36px; margin-right: 1.5em; margin-bottom: 1em; background-color: white; background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA1MTIgNTEyIj48cGF0aCBkPSJNMTg2LjEyIDM0My4zNGMtOS42NSA5LjY1LTkuNjUgMjUuMjkgMCAzNC45NCA5LjY1IDkuNjUgMjUuMjkgOS42NSAzNC45NCAwTDM3OC4yNCAyMjEuMWMxOS4yOS0xOS4yOSA1MC41Ny0xOS4yOSA2OS44NiAwczE5LjI5IDUwLjU3IDAgNjkuODZMMjkzLjk1IDQ0NS4xYzE5LjI3IDE5LjI5IDUwLjUzIDE5LjMxIDY5LjgyLjA0bC4wNC0uMDQgMTE5LjI1LTExOS4yNGMzOC41OS0zOC41OSAzOC41OS0xMDEuMTQgMC0xMzkuNzItMzguNTktMzguNTktMTAxLjE1LTM4LjU5LTEzOS43MiAwbC0xNTcuMjIgMTU3LjJ6bTI0NC4
@vospascal
vospascal / ChromeDevToolsTimlineEvents.js
Created August 9, 2023 21:19
ChromeDevTools timeline events
// https://github.com/ChromeDevTools/devtools-frontend/blob/1061a013745d1f638b1f989204886232fd5a835a/front_end/panels/timeline/TimelineUIUtils.ts
// https://docs.google.com/document/d/1CvAClvFfyA5R-PhYUmn5OOQtYMH4h6I0nSsKchNAySU/preview
// as info https://github.com/GoogleChrome/lighthouse/blob/7ae8bd442d83efcca1cb48c5c48302d974b00756/core/lib/tracehouse/task-groups.js#L26
export const taskGroups = {
painting: {
id: 'painting',
label: 'Painting',
traceEventNames: [
"PaintSetup",
"Paint",
/**
* Open inspector UI. tree, style and DOM panels if enabled. Add listeners for
* document scrolling, resize and tabContainer.TabSelect.
*/
openInspectorUI: function IUI_openInspectorUI()
{
// initialization
if (!this.domplate) {
Cu.import("resource:///modules/domplate.jsm", this);
let dom = Cu.getGlobalForObject(Node);
@Hoseinkangavarnazari
Hoseinkangavarnazari / manifest.js
Created March 29, 2018 00:56
full example of manifest.js for chrome extension
{
"title": "JSON schema for Google Chrome extension manifest files",
"$schema": "http://json-schema.org/draft-04/schema#",
"type": "object",
"additionalProperties": true,
"required": [ "manifest_version", "name", "version" ],
"properties": {
"manifest_version": {
target/
!.mvn/wrapper/maven-wrapper.jar
### STS ###
.apt_generated
.classpath
.factorypath
.project
.settings
.springBeans
@hhuynhlam
hhuynhlam / devtools.html
Created September 17, 2016 19:52
com.haihuynhlam.knockoutjs-inspector
<html>
<body>
<a href="http://src/pages/devtools.js">
http://src/pages/devtools.js
</a>
</body>
</html>