ztr/TelegramPWA
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Teact: Fix effects in portals

Browse Source
This commit is contained in:
Alexander Zinchuk 2023-05-28 14:32:40 +02:00
parent a49374a666
commit 62271f6ced
2 changed files with 16 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/lib/teact/teact-dom.ts
View File

@ -18,8 +18,7 @@ import {
renderComponent, renderComponent,
unmountComponent, unmountComponent,
isFragmentElement, isFragmentElement,
runImmediateEffects, captureImmediateEffects,
willRunImmediateEffects,
} from './teact'; } from './teact';
import { DEBUG } from '../../config'; import { DEBUG } from '../../config';
import { addEventListener, removeAllDelegatedListeners, removeEventListener } from './dom-events'; import { addEventListener, removeAllDelegatedListeners, removeEventListener } from './dom-events';
@ -55,12 +54,10 @@ function render($element: VirtualElement | undefined, parentEl: HTMLElement) {
headsByElement.set(parentEl, { children: [] }); headsByElement.set(parentEl, { children: [] });
} }
const runImmediateEffects = captureImmediateEffects();
const $head = headsByElement.get(parentEl)!; const $head = headsByElement.get(parentEl)!;
const $newElement = renderWithVirtual(parentEl, $head.children[0], $element, $head, 0); const $newElement = renderWithVirtual(parentEl, $head.children[0], $element, $head, 0);
runImmediateEffects?.();
if (!willRunImmediateEffects()) {
runImmediateEffects();
}
$head.children = $newElement ? [$newElement] : []; $head.children = $newElement ? [$newElement] : [];

20
src/lib/teact/teact.ts
View File

@ -309,7 +309,7 @@ let pendingEffects = new Map<string, Effect>();
let pendingCleanups = new Map<string, EffectCleanup>(); let pendingCleanups = new Map<string, EffectCleanup>();
let pendingLayoutEffects = new Map<string, Effect>(); let pendingLayoutEffects = new Map<string, Effect>();
let pendingLayoutCleanups = new Map<string, EffectCleanup>(); let pendingLayoutCleanups = new Map<string, EffectCleanup>();
let areImmediateEffectsPending = false; let areImmediateEffectsCaptured = false;
/* /*
Order: Order:
@ -325,7 +325,7 @@ let areImmediateEffectsPending = false;
*/ */
const runUpdatePassOnRaf = throttleWith(requestMeasure, () => { const runUpdatePassOnRaf = throttleWith(requestMeasure, () => {
areImmediateEffectsPending = true; const runImmediateEffects = captureImmediateEffects();
idsToExcludeFromUpdate = new Set(); idsToExcludeFromUpdate = new Set();
const instancesToUpdate = Array const instancesToUpdate = Array
@ -351,16 +351,20 @@ const runUpdatePassOnRaf = throttleWith(requestMeasure, () => {
forceUpdateComponent(instance); forceUpdateComponent(instance);
}); });
areImmediateEffectsPending = false; runImmediateEffects?.();
runImmediateEffects();
}); });
}); });
export function willRunImmediateEffects() { export function captureImmediateEffects() {
return areImmediateEffectsPending; if (areImmediateEffectsCaptured) {
return undefined;
}
areImmediateEffectsCaptured = true;
return runCapturedImmediateEffects;
} }
export function runImmediateEffects() { function runCapturedImmediateEffects() {
const currentLayoutCleanups = pendingLayoutCleanups; const currentLayoutCleanups = pendingLayoutCleanups;
pendingLayoutCleanups = new Map(); pendingLayoutCleanups = new Map();
currentLayoutCleanups.forEach((cb) => cb()); currentLayoutCleanups.forEach((cb) => cb());
@ -368,6 +372,8 @@ export function runImmediateEffects() {
const currentLayoutEffects = pendingLayoutEffects; const currentLayoutEffects = pendingLayoutEffects;
pendingLayoutEffects = new Map(); pendingLayoutEffects = new Map();
currentLayoutEffects.forEach((cb) => cb()); currentLayoutEffects.forEach((cb) => cb());
areImmediateEffectsCaptured = false;
} }
export function renderComponent(componentInstance: ComponentInstance) { export function renderComponent(componentInstance: ComponentInstance) {