shorten names

elliott/dom-clobbering-fix
Simon Holthausen 1 month ago
parent d2396052ae
commit aff39d9fb0

@ -63,11 +63,11 @@ export const STATE_SYMBOL = Symbol('$state');
export const LEGACY_PROPS = Symbol('legacy props');
export const LOADING_ATTR_SYMBOL = Symbol('');
export const PROXY_PATH_SYMBOL = Symbol('proxy path');
export const ATTRIBUTES_CACHE_SYMBOL = Symbol('attributes');
export const CLASS_NAME_CACHE_SYMBOL = Symbol('class');
export const STYLE_CACHE_SYMBOL = Symbol('style');
export const TEXT_CACHE_SYMBOL = Symbol('text');
export const FORM_RESET_HANDLER_SYMBOL = Symbol('form reset');
export const ATTRIBUTES_CACHE = Symbol('attributes');
export const CLASS_CACHE = Symbol('class');
export const STYLE_CACHE = Symbol('style');
export const TEXT_CACHE = Symbol('text');
export const FORM_RESET_HANDLER = Symbol('form reset');
/** An anchor might change, via this symbol on the original anchor we can tell HMR about the updated anchor */
export const HMR_ANCHOR = Symbol('hmr anchor');

@ -6,8 +6,8 @@ import { create_event, delegate, delegated, event, event_symbol } from './events
import { add_form_reset_listener, autofocus } from './misc.js';
import * as w from '../../warnings.js';
import {
ATTRIBUTES_CACHE_SYMBOL,
FORM_RESET_HANDLER_SYMBOL,
ATTRIBUTES_CACHE,
FORM_RESET_HANDLER,
IS_XHTML,
LOADING_ATTR_SYMBOL
} from '#client/constants';
@ -74,7 +74,7 @@ export function remove_input_defaults(input) {
}
};
/** @type {any} */ (input)[FORM_RESET_HANDLER_SYMBOL] = remove_defaults;
/** @type {any} */ (input)[FORM_RESET_HANDLER] = remove_defaults;
queue_micro_task(remove_defaults);
add_form_reset_listener();
}
@ -565,7 +565,7 @@ export function attribute_effect(
*/
function get_attributes(element) {
return /** @type {Record<string | symbol, unknown>} **/ (
/** @type {any} */ (element)[ATTRIBUTES_CACHE_SYMBOL] ??= {
/** @type {any} */ (element)[ATTRIBUTES_CACHE] ??= {
[IS_CUSTOM_ELEMENT]: element.nodeName.includes('-'),
[IS_HTML]: element.namespaceURI === NAMESPACE_HTML
}

@ -5,7 +5,7 @@ import {
set_active_effect,
set_active_reaction
} from '../../../runtime.js';
import { FORM_RESET_HANDLER_SYMBOL } from '../../../constants.js';
import { FORM_RESET_HANDLER } from '../../../constants.js';
import { add_form_reset_listener } from '../misc.js';
/**
@ -59,15 +59,15 @@ export function without_reactive_context(fn) {
*/
export function listen_to_event_and_reset_event(element, event, handler, on_reset = handler) {
element.addEventListener(event, () => without_reactive_context(handler));
const prev = /** @type {any} */ (element)[FORM_RESET_HANDLER_SYMBOL];
const prev = /** @type {any} */ (element)[FORM_RESET_HANDLER];
if (prev) {
// special case for checkbox that can have multiple binds (group & checked)
/** @type {any} */ (element)[FORM_RESET_HANDLER_SYMBOL] = () => {
/** @type {any} */ (element)[FORM_RESET_HANDLER] = () => {
prev();
on_reset(true);
};
} else {
/** @type {any} */ (element)[FORM_RESET_HANDLER_SYMBOL] = () => on_reset(true);
/** @type {any} */ (element)[FORM_RESET_HANDLER] = () => on_reset(true);
}
add_form_reset_listener();

@ -1,5 +1,5 @@
import { to_class } from '../../../shared/attributes.js';
import { CLASS_NAME_CACHE_SYMBOL } from '../../constants.js';
import { CLASS_CACHE } from '../../constants.js';
import { hydrating } from '../hydration.js';
/**
@ -12,7 +12,7 @@ import { hydrating } from '../hydration.js';
* @returns {Record<string, boolean> | undefined}
*/
export function set_class(dom, is_html, value, hash, prev_classes, next_classes) {
var prev = /** @type {any} */ (dom)[CLASS_NAME_CACHE_SYMBOL];
var prev = /** @type {any} */ (dom)[CLASS_CACHE];
if (
hydrating ||
@ -35,7 +35,7 @@ export function set_class(dom, is_html, value, hash, prev_classes, next_classes)
}
}
/** @type {any} */ (dom)[CLASS_NAME_CACHE_SYMBOL] = value;
/** @type {any} */ (dom)[CLASS_CACHE] = value;
} else if (next_classes && prev_classes !== next_classes) {
for (var key in next_classes) {
var is_present = !!next_classes[key];

@ -1,7 +1,7 @@
import { hydrating } from '../hydration.js';
import { clear_text_content, get_first_child } from '../operations.js';
import { queue_micro_task } from '../task.js';
import { FORM_RESET_HANDLER_SYMBOL } from '../../constants.js';
import { FORM_RESET_HANDLER } from '../../constants.js';
/**
* @param {HTMLElement} dom
@ -46,7 +46,7 @@ export function add_form_reset_listener() {
Promise.resolve().then(() => {
if (!evt.defaultPrevented) {
for (const e of /**@type {HTMLFormElement} */ (evt.target).elements) {
/** @type {any} */ (e)[FORM_RESET_HANDLER_SYMBOL]?.();
/** @type {any} */ (e)[FORM_RESET_HANDLER]?.();
}
}
});

@ -1,5 +1,5 @@
import { to_style } from '../../../shared/attributes.js';
import { STYLE_CACHE_SYMBOL } from '../../constants.js';
import { STYLE_CACHE } from '../../constants.js';
import { hydrating } from '../hydration.js';
/**
@ -29,7 +29,7 @@ function update_styles(dom, prev = {}, next, priority) {
* @param {Record<string, any> | [Record<string, any>, Record<string, any>]} [next_styles]
*/
export function set_style(dom, value, prev_styles, next_styles) {
var prev = /** @type {any} */ (dom)[STYLE_CACHE_SYMBOL];
var prev = /** @type {any} */ (dom)[STYLE_CACHE];
if (hydrating || prev !== value) {
var next_style_attr = to_style(value, next_styles);
@ -42,7 +42,7 @@ export function set_style(dom, value, prev_styles, next_styles) {
}
}
/** @type {any} */ (dom)[STYLE_CACHE_SYMBOL] = value;
/** @type {any} */ (dom)[STYLE_CACHE] = value;
} else if (next_styles) {
if (Array.isArray(next_styles)) {
update_styles(dom, prev_styles?.[0], next_styles[0]);

@ -6,11 +6,11 @@ import { get_descriptor, is_extensible } from '../../shared/utils.js';
import { active_effect } from '../runtime.js';
import { async_mode_flag } from '../../flags/index.js';
import {
ATTRIBUTES_CACHE_SYMBOL,
CLASS_NAME_CACHE_SYMBOL,
ATTRIBUTES_CACHE,
CLASS_CACHE,
REACTION_RAN,
STYLE_CACHE_SYMBOL,
TEXT_CACHE_SYMBOL,
STYLE_CACHE,
TEXT_CACHE,
TEXT_NODE
} from '#client/constants';
import { eager_block_effects } from '../reactivity/batch.js';
@ -55,15 +55,15 @@ export function init_operations() {
if (is_extensible(element_prototype)) {
// the following assignments improve perf of lookups on DOM nodes
/** @type {any} */ (element_prototype)[CLASS_NAME_CACHE_SYMBOL] = undefined;
/** @type {any} */ (element_prototype)[ATTRIBUTES_CACHE_SYMBOL] = null;
/** @type {any} */ (element_prototype)[STYLE_CACHE_SYMBOL] = undefined;
/** @type {any} */ (element_prototype)[CLASS_CACHE] = undefined;
/** @type {any} */ (element_prototype)[ATTRIBUTES_CACHE] = null;
/** @type {any} */ (element_prototype)[STYLE_CACHE] = undefined;
// @ts-expect-error
element_prototype.__e = undefined;
}
if (is_extensible(text_prototype)) {
/** @type {any} */ (text_prototype)[TEXT_CACHE_SYMBOL] = undefined;
/** @type {any} */ (text_prototype)[TEXT_CACHE] = undefined;
}
if (DEV) {

@ -23,7 +23,7 @@ import * as w from './warnings.js';
import * as e from './errors.js';
import { assign_nodes } from './dom/template.js';
import { is_passive_event } from '../../utils.js';
import { COMMENT_NODE, STATE_SYMBOL, TEXT_CACHE_SYMBOL } from './constants.js';
import { COMMENT_NODE, STATE_SYMBOL, TEXT_CACHE } from './constants.js';
import { boundary } from './dom/blocks/boundary.js';
/**
@ -46,8 +46,9 @@ export function set_should_intro(value) {
export function set_text(text, value) {
// For objects, we apply string coercion (which might make things like $state array references in the template reactive) before diffing
var str = value == null ? '' : typeof value === 'object' ? `${value}` : value;
if (str !== (/** @type {any} */ (text)[TEXT_CACHE_SYMBOL] ??= text.nodeValue)) {
/** @type {any} */ (text)[TEXT_CACHE_SYMBOL] = str;
// prettier-ignore
if (str !== (/** @type {any} */ (text)[TEXT_CACHE] ??= text.nodeValue)) {
/** @type {any} */ (text)[TEXT_CACHE] = str;
text.nodeValue = `${str}`;
}
}

Loading…
Cancel
Save