Repository navigation
☂️ Places where DartPad gets embedded #3945
Description
Description
Currently we are aware of the following places that embedd dartpad:
- api.flutter.dev (and main-api.flutter.dev):
- use the
sample_idparam to specify the source code to load - Example: https://main-api.flutter.dev/flutter/material/AppBar-class.html
- Embedding happens via
{@tool dartpad }directives in dartdocs - Context: https://github.com/flutter/flutter/tree/adce6d64da8a2ae00a6f07c5b0e11d925e128519/dev/snippets
- use the
- flutter.dev (and docs.flutter.dev) and dart.dev
- use the PostMessage API (DartPad needs to accept sources via postMessage MassageEvents #3941) to specivy the source doe to load
- Example: https://docs.flutter.dev/ui
- Embedding happens via
<?code-excerpt "lib/main.dart"?>directives in the markdown - Context: https://github.com/flutter/website/tree/f23aedcc551369995a01b04ca826337de2c0a557/packages/site_shared/lib/components/dartpad
Activity
goderbauer commentedon Sep 25, 2026
@parlough @johnpryan Are you aware of other websites / places where we embed dartpad? We are currently collecting them to make sure the new dartpad works with all of our embedding sites.
parlough commentedon Sep 25, 2026
I don't have many examples at hand, but I know some package docs and miscellaneous online tutorials use the gist loading support and embed those manually as an iframe. For example, this one in the
package:signalsdocumentation website: https://dartsignals.dev/#interactive-playgroundIf you mean just Dart and Flutter sites, those you listed are what I'm aware of.
parlough commentedon Sep 25, 2026
Oh also, it doesn't inject any code currently, but the "Try Dart in your browser" section at the end of the dart.dev homepage currently includes DartPad as an embedded iframe. The goal there is mostly to have a relatively focused single-file editing experience to quickly try out Dart and see console output. This one is easy to drop or change if needed though.
johnpryan commentedon Sep 25, 2026
I can see in the Traffic Acquisition analytics that Riverpod's website is using it for their docs I also see that Next Flutter is using it.