Greg Spencer 202b045b50
Rewrite the analyze-sample-code script to also analyze snippets (#23893)
This rewrites the sample code analysis script to be a little less of a hack (but still not pretty), and to handle snippets as well.

It also changes the semantics of how sample code is handled: the namespace for the sample code is now limited to the file that it appears in, so some additional "Examples can assume:" blocks were added. The upside of this is that there will be far fewer name collisions.

I fixed the output too: no longer will you get 4000 lines of numbered output with the error at the top and have to grep for the actual problem. It gives the filename and line number of the original location of the code (in the comment in the tree), and prints out the source code on the line that caused the problem along with the error.

For snippets, it prints out the location of the start of the snippet and the source code line that causes the problem. It can't print out the original line, because snippets get formatted when they are written, so the line might not be in the same place.
2018-11-05 07:31:35 -08:00
..

Snippet Tool

This is a dartdoc extension tool that takes code snippets and expands how they are presented so that Flutter can have more interactive and useful code snippets.

This takes code in dartdocs, like this:

/// The following is a skeleton of a stateless widget subclass called `GreenFrog`:
/// {@tool snippet --template="stateless_widget"}
/// class GreenFrog extends StatelessWidget {
///   const GreenFrog({ Key key }) : super(key: key);
///
///   @override
///   Widget build(BuildContext context) {
///     return Container(color: const Color(0xFF2DBD3A));
///   }
/// }
/// {@end-tool}

And converts it into something which has a nice visual presentation, and a button to automatically copy the sample to the clipboard.

It does this by processing the source input and emitting HTML for output, which dartdoc places back into the documentation. Any options given to the {@tool ...} directive are passed on verbatim to the tool.

To render the above, the snippets tool needs to render the code in a combination of markdown and HTML, using the {@inject-html} dartdoc directive.

Templates

In order to support showing an entire app when you click on the right tab of the code snippet UI, we have to be able to insert the snippet into the template and instantiate the right parts.

To do this, there is a config/templates directory that contains a list of templates. These templates represent an entire app that the snippet can be placed into, basically a replacement for lib/main.dart in a flutter app package.

Skeletons

A skeleton (in relation to this tool, in the config/skeletons directory) is an HTML template into which the snippet Dart code and description are interpolated, in order to display it nicely.

There is currently one skeleton for application snippets and one for sample snippets, but there could be more. It uses moustache notation (e.g. {{code}}) to mark where the components to be interpolated into the template should go.

(It doesn't actually use the moustache package, since the only things that need substituting are simple strings, but it uses the same syntax).