swaits/dioxus
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move asset hashing into the CLI (#3988)

Browse Source 
* Fix deduping assets

* hash assets in the linker

* fix extracting assets

* Fix the hashed asset name

* deserialize the asset back from the link section

* prevent the read from being inlined

* remove some extra logs

* Fix liveview routing

* Only look for direct dependencies on dioxus features

* fix wasm split test

* On wasm, create a new object file with the asset information

* Fix multiple assets

* add a regression test for 3467

* fix image link

* fix linker out file

* fix linux linker args

* add windows linker command

* fix linux link args

* fix windows target triple

* Expose an option to build assets in the linker intercept

* Fix the standalone optimizer and document it in the dx help command

* include the cli opt version in the hash

* fix clippy

* fix ssg port

* add a safety note to the read_volatile call

* move found assets log

* fix some merge conflicts

* fix build

* make most env var for the linker optional

* guess the target triple when dx acts as the linker intercept

* automatically find the linker for normal builds

* use the right linker in wasm mode

* fix mac linker

* look inside archive files (rlibs)

* remove out.txt

* fix clippy

* fix typo

* fix clippy

* fix build

* fix dx link name in docs

* ignore libcompiler_builtins warnings

* fix playwright

* pass typocheck

* fix printing sysroot

* Modify final binary

* fix wasm assets

* remove old link section logic

* fix tests

* forward manganis export args

* fail to evaluate relocatable address

* retain all exports in the same pattern as other platforms

* Fix adding assets during a wasm hot patch

* less nesting and remove logs

* fix clippy

* log pdb files

* read from pdb

* print data section contents

* print with object

* normal windows builds working

* fix hot patch windows

* clean up logs

* fix clippy

* clean up assets

* use the most recent pdb

* fix doc test

* fix typo

* tiny nits

* make bundled a reference instead of a pointer

* add helpful comment to impl

* match on file format

* Fix asset hashing comment

---------

Co-authored-by: Jonathan Kelley <jkelleyrtp@gmail.com>
This commit is contained in:
Evan AlmloffandJonathan Kelley authored and GitHub committed 2025-05-31 21:45:12 +02:00
1 parent f865e3f559
commit 58669f892d
45 files changed
+1174 -762
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

packages/playwright-tests/cli-optimization.spec.js
+15
View File
@@ -8,4 +8,19 @@ test("optimized scripts run", async ({ page }) => {
// should add an editor to the page that shows a main function
const main = page.locator("#main");
await expect(main).toContainText("hi");
// Expect the page to contain an image with the id "some_image"
const image = page.locator("#some_image");
await expect(image).toBeVisible();
// Get the image src
const src = await image.getAttribute("src");
// Expect the page to contain an image with the id "some_image_with_the_same_url"
const image2 = page.locator("#some_image_with_the_same_url");
await expect(image2).toBeVisible();
// Get the image src
const src2 = await image2.getAttribute("src");
// Expect the urls to be different
expect(src).not.toEqual(src2);
});
packages/playwright-tests/cli-optimization/src/main.rs
+7
View File
@@ -4,6 +4,8 @@ use dioxus::prelude::*;
const MONACO_FOLDER: Asset = asset!("/monaco-editor-0.52.2/package/min/vs");
const SOME_IMAGE: Asset = asset!("/images/toasts.png", ImageAssetOptions::new().with_avif());
const SOME_IMAGE_WITH_THE_SAME_URL: Asset =
asset!("/images/toasts.png", ImageAssetOptions::new().with_jpg());
fn main() {
dioxus::launch(App);
@@ -32,7 +34,12 @@ fn App() -> Element {
"onload": script
}
img {
id: "some_image",
src: "{SOME_IMAGE}"
}
img {
id: "some_image_with_the_same_url",
src: "{SOME_IMAGE_WITH_THE_SAME_URL}"
}
}
}
packages/playwright-tests/nested-suspense-ssg.spec.js
+44 -43
View File
@@ -1,50 +1,51 @@
// @ts-check
const { test, expect } = require("@playwright/test");
// TODO: ssg is disabled in the CLI server
// // @ts-check
// const { test, expect } = require("@playwright/test");
test("nested suspense resolves", async ({ page }) => {
// Wait for the dev server to reload
await page.goto("http://localhost:5050");
// Then wait for the page to start loading
await page.goto("http://localhost:5050", { waitUntil: "commit" });
// test("nested suspense resolves", async ({ page }) => {
// // Wait for the dev server to reload
// await page.goto("http://localhost:6060");
// // Then wait for the page to start loading
// await page.goto("http://localhost:6060", { waitUntil: "commit" });
// Expect the page to contain the suspense result from the server
const mainMessageTitle = page.locator("#title-0");
await expect(mainMessageTitle).toContainText("The robot says hello world");
const mainMessageBody = page.locator("#body-0");
await expect(mainMessageBody).toContainText(
"The robot becomes sentient and says hello world"
);
// // Expect the page to contain the suspense result from the server
// const mainMessageTitle = page.locator("#title-0");
// await expect(mainMessageTitle).toContainText("The robot says hello world");
// const mainMessageBody = page.locator("#body-0");
// await expect(mainMessageBody).toContainText(
// "The robot becomes sentient and says hello world"
// );
// And expect the title to have resolved on the client
await expect(page).toHaveTitle("The robot says hello world");
// // And expect the title to have resolved on the client
// await expect(page).toHaveTitle("The robot says hello world");
// Nested suspense should be resolved
const nestedMessageTitle1 = page.locator("#title-1");
await expect(nestedMessageTitle1).toContainText("The world says hello back");
const nestedMessageBody1 = page.locator("#body-1");
await expect(nestedMessageBody1).toContainText(
"In a stunning turn of events, the world collectively unites and says hello back"
);
// // Nested suspense should be resolved
// const nestedMessageTitle1 = page.locator("#title-1");
// await expect(nestedMessageTitle1).toContainText("The world says hello back");
// const nestedMessageBody1 = page.locator("#body-1");
// await expect(nestedMessageBody1).toContainText(
// "In a stunning turn of events, the world collectively unites and says hello back"
// );
const nestedMessageDiv2 = page.locator("#children-2");
await expect(nestedMessageDiv2).toBeEmpty();
const nestedMessageTitle2 = page.locator("#title-2");
await expect(nestedMessageTitle2).toContainText("Goodbye Robot");
const nestedMessageBody2 = page.locator("#body-2");
await expect(nestedMessageBody2).toContainText("The robot says goodbye");
// const nestedMessageDiv2 = page.locator("#children-2");
// await expect(nestedMessageDiv2).toBeEmpty();
// const nestedMessageTitle2 = page.locator("#title-2");
// await expect(nestedMessageTitle2).toContainText("Goodbye Robot");
// const nestedMessageBody2 = page.locator("#body-2");
// await expect(nestedMessageBody2).toContainText("The robot says goodbye");
const nestedMessageDiv3 = page.locator("#children-3");
await expect(nestedMessageDiv3).toBeEmpty();
const nestedMessageTitle3 = page.locator("#title-3");
await expect(nestedMessageTitle3).toContainText("Goodbye World");
const nestedMessageBody3 = page.locator("#body-3");
await expect(nestedMessageBody3).toContainText("The world says goodbye");
// const nestedMessageDiv3 = page.locator("#children-3");
// await expect(nestedMessageDiv3).toBeEmpty();
// const nestedMessageTitle3 = page.locator("#title-3");
// await expect(nestedMessageTitle3).toContainText("Goodbye World");
// const nestedMessageBody3 = page.locator("#body-3");
// await expect(nestedMessageBody3).toContainText("The world says goodbye");
// Deeply nested suspense should be resolved
const nestedMessageDiv4 = page.locator("#children-4");
await expect(nestedMessageDiv4).toBeEmpty();
const nestedMessageTitle4 = page.locator("#title-4");
await expect(nestedMessageTitle4).toContainText("Hello World");
const nestedMessageBody4 = page.locator("#body-4");
await expect(nestedMessageBody4).toContainText("The world says hello again");
});
// // Deeply nested suspense should be resolved
// const nestedMessageDiv4 = page.locator("#children-4");
// await expect(nestedMessageDiv4).toBeEmpty();
// const nestedMessageTitle4 = page.locator("#title-4");
// await expect(nestedMessageTitle4).toContainText("Hello World");
// const nestedMessageBody4 = page.locator("#body-4");
// await expect(nestedMessageBody4).toContainText("The world says hello again");
// });
packages/playwright-tests/playwright.config.js
+2 -2
View File
@@ -87,8 +87,8 @@ module.exports = defineConfig({
{
cwd: path.join(process.cwd(), "web"),
command:
'cargo run --package dioxus-cli --release -- serve --force-sequential --platform web --addr "127.0.0.1" --port 9999',
port: 9999,
'cargo run --package dioxus-cli --release -- serve --force-sequential --platform web --addr "127.0.0.1" --port 9990',
port: 9990,
timeout: 50 * 60 * 1000,
reuseExistingServer: !process.env.CI,
stdout: "pipe",
packages/playwright-tests/wasm-split-harness/.cargo/config.toml
+3
View File
@@ -0,0 +1,3 @@
# It's recommended to set the flag on a per-target basis:
[target.wasm32-unknown-unknown]
rustflags = ['--cfg', 'getrandom_backend="wasm_js"']
packages/playwright-tests/web.spec.js
+14 -14
View File
@@ -2,7 +2,7 @@
const { test, expect, defineConfig } = require("@playwright/test");
test("button click", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// Expect the page to contain the counter text.
const main = page.locator("#main");
@@ -21,7 +21,7 @@ test("button click", async ({ page }) => {
});
test("svg", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// Expect the page to contain the svg.
const svg = page.locator("svg");
@@ -36,7 +36,7 @@ test("svg", async ({ page }) => {
});
test("raw attribute", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// Expect the page to contain the div with the raw attribute.
const div = page.locator("div.raw-attribute-div");
@@ -44,7 +44,7 @@ test("raw attribute", async ({ page }) => {
});
test("hidden attribute", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// Expect the page to contain the div with the hidden attribute.
const div = page.locator("div.hidden-attribute-div");
@@ -52,7 +52,7 @@ test("hidden attribute", async ({ page }) => {
});
test("dangerous inner html", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// Expect the page to contain the div with the dangerous inner html.
const div = page.locator("div.dangerous-inner-html-div");
@@ -60,7 +60,7 @@ test("dangerous inner html", async ({ page }) => {
});
test("input value", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// Expect the page to contain the input with the value.
const input = page.locator("input");
@@ -68,7 +68,7 @@ test("input value", async ({ page }) => {
});
test("style", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// Expect the page to contain the div with the style.
const div = page.locator("div.style-div");
@@ -77,7 +77,7 @@ test("style", async ({ page }) => {
});
test("eval", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// Expect the page to contain the div with the eval and have no text.
const div = page.locator("div.eval-result");
@@ -95,7 +95,7 @@ test("eval", async ({ page }) => {
});
test("prevent default", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// Expect the page to contain the div with the eval and have no text.
const a = page.locator("a.prevent-default");
@@ -109,7 +109,7 @@ test("prevent default", async ({ page }) => {
});
test("onmounted", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// Expect the onmounted event to be called exactly once.
const mountedDiv = page.locator("div.onmounted-div");
@@ -117,7 +117,7 @@ test("onmounted", async ({ page }) => {
});
test("web-sys closure", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// wait until the div is mounted
const scrollDiv = page.locator("div#web-sys-closure-div");
await scrollDiv.waitFor({ state: "attached" });
@@ -126,7 +126,7 @@ test("web-sys closure", async ({ page }) => {
});
test("document elements", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// wait until the meta element is mounted
const meta = page.locator("meta#meta-head[name='testing']");
await meta.waitFor({ state: "attached" });
@@ -157,7 +157,7 @@ test("document elements", async ({ page }) => {
});
test("merge styles", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// wait until the div is mounted
const div = page.locator("div#merge-styles-div");
await div.waitFor({ state: "attached" });
@@ -167,7 +167,7 @@ test("merge styles", async ({ page }) => {
});
test("select multiple", async ({ page }) => {
await page.goto("http://localhost:9999");
await page.goto("http://localhost:9990");
// wait until the select element is mounted
const staticSelect = page.locator("select#static-multiple-select");
await staticSelect.waitFor({ state: "attached" });