Skip to content

Instantly share code, notes, and snippets.

View rniwa's full-sized avatar

Ryosuke Niwa rniwa

268 followers · 0 following
View GitHub Profile
@rniwa
rniwa / disabled-mouse-event.html
Last active March 8, 2022 09:52
Dispatching a mouse event and a non-mouse on a disabled button
<!DOCTYPE html>
<html>
<body>
<div><button id="button" type="submit" disabled><span>Go</span></button></div>
<pre id="log"></pre>
<script>
function logEventCapturing(event) { document.getElementById('log').textContent += `${event.type} on ${this.localName} capturing path:${event.composedPath().length}\n`; }
function logEventBubbling(event) { document.getElementById('log').textContent += `${event.type} on ${this.localName} bubbling path:${event.composedPath().length}\n`; }
@rniwa
rniwa / gist:43508508f1d418f9f576
Last active August 7, 2020 07:43
why-is-dom-transaction-hard 
mutateElementToAffectOffsetTop(someElement);

// (1) We don't know the value of someElement.offsetTop here because we compute it lazily.

var y = (new DOMTransaction(function () {
    // (2) We need to remember the "old value" of someElement.offsetTop here.
    mutateElementToAffectOffsetTop(someElement);
    return someElement.offsetTop; 
})).execute();
@rniwa
rniwa / resize.html
Created October 15, 2019 02:10
resize event test
<!DOCTYPE html>
<html>
<body>
<pre id="log"></pre>
<script>
let lastSize = null;
function updateSize() {
const width = window.innerWidth;
const height = window.innerHeight;
@rniwa
rniwa / radio-click.html
Created September 6, 2018 20:05
Dispatching click event on a radio button and observing the event phase inside a change event listener
<!DOCTYPE html>
<html>
<body>
<input type="radio">
<script>
const input = document.querySelector('input');
const clickEvent = new MouseEvent('click', {button: 0, which: 1});
input.addEventListener('change', () => {
alert(clickEvent.eventPhase);
@rniwa
rniwa / form-stop-propagation.html
Created September 6, 2018 07:22
Stopping of submit event at a form element
<!DOCTYPE html>
<html>
<body>
<form id="outer-form" action="javascript:doAction(outerForm)">
</form>
<form id="inner-form" method="GET" action="javascript:doAction(innerForm)">
<div id="buttonParent">
<input>
<button id="submitButton" type="submit">Go</button>
</div>
@rniwa
rniwa / slotchange-removal.html
Created August 30, 2018 23:45
Demonstrating the problem that the setter of textContent creates a superfluous slotchange events
<!DOCTYPE html>
<html>
<body>
<pre id="result"></pre>
<script>
async function createTree(shadowContent)
{
const host = document.createElement('div');
host.innerHTML = '<span></span>';
@rniwa
rniwa / timing-of-connectedCallback-affected-by-presence-of-disconnectedCallback.html
Created August 15, 2018 03:25
Demo that the presence of disconnectedCallback can expedite an invocation of connectedCallback
<!doctype html>
<html>
<body>
<pre id="log"></pre>
<script>
function log(text) {
document.getElementById('log').textContent += `${text}\n`;
}
@rniwa
rniwa / DOMTransactionSketch.js
Last active May 31, 2016 01:50
transaction = new DOMTransaction(function (container, articleList) {
var childCount = container.childNodes.length;
for (let article of articleList)
container.append(article);
// No DOM mutation is made until this function exits.
console.assert(childCount == container.childNodes.length);
});
transaction.commit(element, articles);
@rniwa
rniwa / RenderBlock.cpp.diff
Created April 18, 2013 21:50
Logging of the number of objects that has floats or regions in the ancestor chain in logicalLeftSelectionOffset and logicalRightSelectionOffset
Index: Source/WebCore/rendering/RenderBlock.cpp
===================================================================
--- Source/WebCore/rendering/RenderBlock.cpp (revision 148625)
+++ Source/WebCore/rendering/RenderBlock.cpp (working copy)
@@ -3703,13 +3703,49 @@
(state == RenderObject::SelectionEnd && !ltr);
}
+#define LSO_LOG 1
+
@rniwa
rniwa / gist:2721861
Created May 17, 2012 22:07
Process: Safari [30260]
Path: /Applications/Safari.app/Contents/MacOS/Safari
Identifier: org.webkit.nightly.WebKit
Version: r117439 (117439)
Code Type: X86-64 (Native)
Parent Process: launchd [1832]
Date/Time: 2012-05-17 13:52:51.722 -0700
OS Version: Mac OS X 10.6.8 (10K549)
Report Version: 6