<!DOCTYPE html>
<html style="width: 100%; height: 100%;">
<head>
<meta charset="utf-8">
<title>Scheduler Test Page</title>
<style>
.correct {
border: solid green 2px;
}
.incorrect {
border: dashed red 2px;
}
</style>
</head>
<body>
<h1>Scheduler Fixture</h1>
<p>
This fixture is for manual testing purposes, and the patterns used in
implementing it should not be used as a model. This is mainly for anyone
working on making changes to the `schedule` module.
</p>
<h2>Tests:</h2>
<ol>
<li>
<button onClick="runTestOne()">Run Test 1</button>
<p>Calls the callback within the frame when not blocked:</p>
<div><b>Expected:</b></div>
<div id="test-1-expected">
</div>
<div> -------------------------------------------------</div>
<div> If you see the same above and below it's correct.
<div> -------------------------------------------------</div>
<div><b>Actual:</b></div>
<div id="test-1"></div>
</li>
<li>
<p>Accepts multiple callbacks and calls within frame when not blocked</p>
<button onClick="runTestTwo()">Run Test 2</button>
<div><b>Expected:</b></div>
<div id="test-2-expected">
</div>
<div> -------------------------------------------------</div>
<div> If you see the same above and below it's correct.
<div> -------------------------------------------------</div>
<div><b>Actual:</b></div>
<div id="test-2"></div>
</li>
<li>
<p>Schedules callbacks in correct order when they use scheduleCallback to schedule themselves</p>
<button onClick="runTestThree()">Run Test 3</button>
<div><b>Expected:</b></div>
<div id="test-3-expected">
</div>
<div> -------------------------------------------------</div>
<div> If you see the same above and below it's correct.
<div> -------------------------------------------------</div>
<div><b>Actual:</b></div>
<div id="test-3"></div>
</li>
<li>
<p>Calls timed out callbacks and then any more pending callbacks, defers others if time runs out</p>
<button onClick="runTestFour()">Run Test 4</button>
<div><b>Expected:</b></div>
<div id="test-4-expected">
</div>
<div> -------------------------------------------------</div>
<div> If you see the same above and below it's correct.
<div> -------------------------------------------------</div>
<div><b>Actual:</b></div>
<div id="test-4"></div>
</li>
<li>
<p>When some callbacks throw errors, still calls them all within the same frame</p>
<p><b>IMPORTANT:</b> Open the console when you run this! Inspect the logs there!</p>
<button onClick="runTestFive()">Run Test 5</button>
</li>
<li>
<p>When some callbacks throw errors <b> and some also time out</b>, still calls them all within the same frame</p>
<p><b>IMPORTANT:</b> Open the console when you run this! Inspect the logs there!</p>
<button onClick="runTestSix()">Run Test 6</button>
</li>
<li>
<p>Continues calling callbacks even when user switches away from this tab</p>
<button onClick="runTestSeven()">Run Test 7</button>
<div><b>Click the button above, observe the counter, then switch to
another tab and switch back:</b></div>
<div id="test-7">
</div>
<div> If the counter advanced while you were away from this tab, it's correct.</div>
</li>
<li>
<p>Can pause execution, dump scheduled callbacks, and continue where it left off</p>
<button onClick="runTestEight()">Run Test 8</button>
<div><b>Click the button above, press "continue" to finish the test after it pauses:</b></div>
<button onClick="continueTestEight()">continue</button>
<div><b>Expected:</b></div>
<div id="test-8-expected">
</div>
<div> -------------------------------------------------</div>
<div> If the test didn't progress until you hit "continue" and </div>
<div> you see the same above and below afterwards it's correct.
<div> -------------------------------------------------</div>
<div><b>Actual:</b></div>
<div id="test-8"></div>
</li>
<li>
<p>Can force a specific framerate</p>
<p><b>IMPORTANT:</b> This test may be flaky if other tests have been run in this js instance. To get a clean test refresh the page before running test 9</p>
<button onClick="runTestNine()">Run Test 9</button>
<div><b>Expected:</b></div>
<div id="test-9-expected">
</div>
<div> -------------------------------------------------</div>
<div> If you see the same above and below it's correct.
<div> -------------------------------------------------</div>
<div><b>Actual:</b></div>
<div id="test-9"></div>
</div>
</li>
<li>
<p>Runs scheduled JS work for 99% of the frame time when nothing else is using the thread.</p>
<p><b>NOTE:</b> Try this test both when nothing else is running and when something is using the compositor thread in another visible tab with video or <a href="https://www.shadertoy.com/view/MtffDX">WebGL content</a> (Shift+Click).</p>
<button onClick="runTestTen()">Run Test 10</button>
<div><b>Expected:</b></div>
<div id="test-10-expected">
</div>
<div> -------------------------------------------------</div>
<div> If you see the same above and below it's correct.
<div> -------------------------------------------------</div>
<div><b>Actual:</b></div>
<div id="test-10"></div>
</div>
</li>
<li>
<p>Runs scheduled JS work more than 95% of the frame time when inserting DOM nodes.</p>
<p><b>NOTE:</b> Try this test both when nothing else is running and when something is using the compositor thread in another visible tab with video or <a href="https://www.shadertoy.com/view/MtffDX">WebGL content</a> (Shift+Click).</p>
<button onClick="runTestEleven()">Run Test 11</button>
<div><b>Expected:</b></div>
<div id="test-11-expected">
</div>
<div> -------------------------------------------------</div>
<div> If you see the same above and below it's correct.
<div> -------------------------------------------------</div>
<div><b>Actual:</b></div>
<div id="test-11"></div>
</div>
</li>
</ol>
<script src="../../build/node_modules/react/umd/react.production.min.js"></script>
<script src="../../build/node_modules/scheduler/umd/scheduler.production.min.js"></script>
<script src="https://unpkg.com/babel-standalone@6/babel.js"></script>
<script type="text/babel">
const {
unstable_scheduleCallback: scheduleCallback,
unstable_cancelCallback: cancelCallback,
unstable_now: now,
unstable_getFirstCallbackNode: getFirstCallbackNode,
unstable_pauseExecution: pauseExecution,
unstable_continueExecution: continueExecution,
unstable_forceFrameRate: forceFrameRate,
unstable_shouldYield: shouldYield,
unstable_NormalPriority: NormalPriority,
} = Scheduler;
function displayTestResult(testNumber) {
const expectationNode = document.getElementById('test-' + testNumber + '-expected');
const resultNode = document.getElementById('test-' + testNumber);
resultNode.innerHTML = latestResults[testNumber - 1].join('<br />');
expectationNode.innerHTML = expectedResults[testNumber - 1].join('<br />');
}
function clearTestResult(testNumber) {
const resultNode = document.getElementById('test-' + testNumber);
resultNode.innerHTML = '';
latestResults[testNumber - 1] = [];
}
function updateTestResult(testNumber, textToAddToResult) {
latestResults[testNumber - 1].push(textToAddToResult);
};
function checkTestResult(testNumber) {
let correct = true;
const expected = expectedResults[testNumber - 1]; // zero indexing
const result = lates
没有合适的资源?快使用搜索试试~ 我知道了~
react-16.14.0.tar.gz
需积分: 0 0 下载量 191 浏览量
2024-05-04
14:36:42
上传
评论
收藏 7.63MB GZ 举报
温馨提示
react.js for linux 各个版本,免费下载 前端三大框架之一 react 各个版本,免费下载 如果下载不了,关注我,评论区联系我 React 是一个库。它允许你将组件放在一起,但不关注路由和数据获取。要使用 React 构建整个应用程序,建议使用像 Next.js 或 Remix 这样的全栈 React 框架。
资源推荐
资源详情
资源评论
收起资源包目录
react-16.14.0.tar.gz (2000个子文件)
root.css 8KB
style.css 4KB
codemirror-paraiso-dark.css 2KB
OwnersStack.css 2KB
Profiler.css 2KB
index.css 2KB
SchedulingProfiler.css 2KB
TabBar.css 2KB
InspectedElementView.css 2KB
Element.css 2KB
InspectedElement.css 1KB
hydration.css 1KB
EventTooltip.css 1KB
Components.css 1KB
DevTools.css 1KB
Tree.css 1KB
ErrorBoundary.css 1011B
SidebarCommitInfo.css 1004B
SidebarSelectedFiberInfo.css 991B
StyleEditor.css 986B
InspectedElementHooksTree.css 965B
Toggle.css 907B
InteractionListItem.css 895B
EditableValue.css 870B
InspectedElementSharedStyles.css 851B
LayoutViewer.css 826B
SidebarInteractions.css 825B
RecordToggle.css 816B
ModalDialog.css 765B
SearchInput.css 693B
KeyValue.css 676B
ChartNode.css 626B
HoveredFiberInfo.css 598B
ContextMenuItem.css 592B
ProfilingImportExportButtons.css 522B
Tooltip.css 494B
SnapshotSelector.css 494B
Badge.css 475B
styles.css 460B
SnapshotCommitList.css 397B
Chrome.css 394B
ContextMenuItem.css 388B
HocBadges.css 387B
WhatChanged.css 356B
App.css 348B
index.css 348B
SnapshotCommitListItem.css 338B
NewArrayValue.css 327B
Tooltip.css 326B
UnsupportedVersionDialog.css 314B
styles.css 303B
AutoSizeInput.css 288B
NoCommitData.css 282B
SelectedTreeHighlight.css 269B
ListItem.css 260B
Page.css 243B
NoInteractions.css 240B
ContextMenu.css 227B
ImportButton.css 226B
index.css 189B
List.css 189B
EditableName.css 187B
NewKeyValue.css 159B
ContextMenu.css 158B
CommitFlamegraph.css 151B
ExpandCollapseToggle.css 135B
WarnIfLegacyBackendDetected.css 127B
CanvasPage.css 104B
Interactions.css 101B
index.css 90B
index.css 87B
ButtonIcon.css 69B
Icon.css 63B
CommitRanked.css 60B
RootSelector.css 23B
index.html 24KB
index.html 9KB
app.html 7KB
index.html 7KB
index.html 3KB
index.html 3KB
index.html 3KB
index.html 2KB
index.html 2KB
canary.html 2KB
16.6.html 2KB
16.7.html 2KB
next.html 2KB
renderer.html 2KB
index.html 2KB
16.5.html 2KB
index.html 2KB
index.html 2KB
16.0.html 1KB
16.4.html 1KB
16.1.html 1KB
16.3.html 1KB
16.2.html 1KB
index.html 1KB
14.9.html 1KB
共 2000 条
- 1
- 2
- 3
- 4
- 5
- 6
- 20
资源评论
段子手-168
- 粉丝: 4503
- 资源: 2745
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
最新资源
资源上传下载、课程学习等过程中有任何疑问或建议,欢迎提出宝贵意见哦~我们会及时处理!
点击此处反馈
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功