Skip to content

Framework7 Kitchen Sink Runtime Check

Focused runtime validation for the Framework7 8 kitchen sink mobile demo.

Introduction

Use this temporary runtime check to verify that the key Framework7 kitchen sink routes still render after the latest changes.

Open each showcase route in Design View.
Confirm the expected hero or component surfaces appear.
Use the conclusion step to hand back into the broader Wappler tour set.

Home route renders

The runtime check opens the generated kitchen sink home page and confirms that the curated landing shell renders inside the mobile design preview.

Home page opens

The runtime check opens the generated kitchen sink home page and waits for the landing shell to render in Design View.

Open the generated kitchen sink home page.
Wait for the hero and the App Connect route entry to appear.

Home shell checks

The landing page should show the new hero, curated showcase cards, and the route entry points without breaking the Framework7 shell.

Hero renders
The kitchen hero section appears in the preview.
Routes exposed
The curated route links are present and selectable.
Shell intact
The page still loads as a routed Framework7 app shell.
Render the home page in Design View
Confirm the hero container exists
Confirm the curated route link exists

Standard showcase route works

The runtime check loads the standard Framework7 showcase and confirms that the routed page and popup sample still render inside the updated shell.

Standard route opens

The runtime check opens the standard Framework7 showcase and waits for its routed hero surface to render.

Open the standard showcase page.
Wait for the routed hero surface to render.

The runtime check opens the showcase popup trigger to confirm the routed sample remains interactive.

Trigger the showcase popup.
Confirm the routed sample still responds.

Standard showcase checks

The routed Framework7 page should load and its popup sample trigger should stay interactive from the sample area.

Route transition
The showcase route resolves to the standard hero page.
Popup trigger works
The popup sample trigger remains clickable inside the routed experience.
Native surfaces
Cards, chips, and popup entry points stay visible in the updated shell.
Open the standard showcase from the home page
Wait for the standard hero block
Click the sample popup trigger without breaking the page shell

App Connect showcase reacts

The runtime check loads the App Connect showcase, switches the page from launch mode to operations mode, and confirms that the bound state updates still render.

App Connect route opens

The runtime check opens the App Connect showcase and waits for the routed hero surface to load.

Open the App Connect showcase page.
Wait for the routed hero surface to load.

Operations mode responds

The runtime check switches the showcase into operations mode and waits for the bound state updates to appear.

Switch the showcase into Operations mode.
Wait for the operations story and progress surface to appear.

App Connect checks

The App Connect page must load its bound layout and respond when the mode toggle switches the view from launch to operations.

State toggle
The segmented control flips the page into operations mode.
Bound progress
The progress surface remains present after the state change.
Mode copy updates
The view exposes the operations story text after the toggle.
Open the App Connect showcase route
Switch from Launch to Operations
Confirm the operations state text and progress surface remain visible

Capacitor showcase loads

The runtime check loads the Capacitor showcase and confirms that the device-aware components still render inside the routed page shell.

Capacitor route opens

The runtime check opens the Capacitor showcase and waits for the routed hero and component surfaces to render.

Open the Capacitor showcase page.
Wait for the hero and component surfaces to render.

Capacitor checks

The Capacitor showcase should render the routed hero plus the app, network, and geolocation component surfaces without breaking the page.

App component
The Capacitor App component is present on the page.
Network component
The Capacitor Network component is present on the page.
Geolocation component
The Capacitor Geolocation component is present on the page.
Open the Capacitor showcase route
Confirm the routed hero renders
Confirm all three Capacitor component nodes are present

Conclusion

The runtime probe is complete. Use the follow-up link to continue with the broader product tour set.

Next steps

Continue with a broader Wappler tour after the kitchen sink runtime check.

Runtime verified
The mobile demo probe completed.
Finish the validation pass
Return to a broader product tour if needed