Use markdown_samples.md in generated test profile package. (#8647)

Author: isoos

app/lib/tool/test_profile/import_source.dart

@@ -14,12 +14,15 @@ import 'package:meta/meta.dart';
 import 'package:path/path.dart' as p;
 import 'package:tar/tar.dart';
 
-import '../../fake/backend/fake_pana_runner.dart';
 import '../../shared/urls.dart' as urls;
 
 import 'models.dart';
 import 'resolver.dart' as resolver;
 
+final _markdownSamples =
+    File(p.join('lib', 'tool', 'test_profile', 'markdown_samples.md'))
+        .readAsStringSync();
+
 /// Utility class for resolving and getting data for profiles.
 class ImportSource {
   final _client = Client();
@@ -103,26 +106,24 @@ class ImportSource {
     TestArchiveTemplate? template,
   ) async {
     final key = '$package/$version';
-    final hasher = createHasher(key);
     if (_archives.containsKey(key)) {
       return _archives[key]!;
     }
     final archive = ArchiveBuilder();
-    final hasHomepage = !version.contains('nohomepage');
-    final hasRepository = hasher('hasRepository', max: 20) > 0;
-    final isLegacy = version.contains('legacy');
 
-    final sdkConstraint =
-        template?.sdkConstraint ?? (isLegacy ? '>=1.12.0 <2.0.0' : '^3.0.0');
+    final homepage = template?.homepage ?? 'https://$package.example.com/';
+    final repository =
+        template?.repository ?? 'https://github.com/example/$package';
+    final sdkConstraint = template?.sdkConstraint ?? '^3.0.0';
 
     final isFlutter = package.startsWith('flutter_');
     final screenshot = TestScreenshot.success();
     final pubspec = json.encode({
       'name': package,
       'version': version,
       'description': '$package is awesome',
-      if (hasHomepage) 'homepage': 'https://$package.example.com/',
-      if (hasRepository) 'repository': 'https://github.com/example/$package',
+      if (homepage.isNotEmpty) 'homepage': homepage,
+      if (repository.isNotEmpty) 'repository': repository,
       'environment': {
         'sdk': '$sdkConstraint',
       },
@@ -141,8 +142,13 @@ class ImportSource {
       'topics': ['chemical-element'],
     });
 
+    final readmeContent = [
+      '# $package\n\nAwesome package.',
+      if (template?.markdownSamples ?? false) _markdownSamples,
+    ].join('\n\n');
+
     archive.addFile('pubspec.yaml', pubspec);
-    archive.addFile('README.md', '# $package\n\nAwesome package.');
+    archive.addFile('README.md', readmeContent);
     archive.addFile('CHANGELOG.md', '## $version\n\n- updated');
     archive.addFile('lib/$package.dart', '''library;
 

app/lib/tool/test_profile/markdown_samples.md

@@ -0,0 +1,55 @@
+# Header 1
+
+Paragraph with `inline code block`. Overall, the text content here should be
+long enough that it will be displayed as multiple lines. It demonstrates the
+line height and we may also use it to track subtle changes in the layout
+(maybe enable hyphens?).
+
+## Header 2 - also a longer block of text that should be breaking into multiple lines even in desktop view
+
+Paragraph with **bold text**.
+
+***
+
+Separated by a line, also using *italic formatting*.
+
+### Header 3
+
+Paragraph with [link and `inline code`](https://pub.dev/).
+
+#### Header 4
+##### Header 5
+###### Header6
+
+> Blockquote with unordered list:
+> - item 1
+> - item 2
+
+Ordered list and list nesting:
+1. item 1.
+1. item 2.
+    1. item 2.1.
+    1. item 2.2.
+1. item 3.
+on multiple lines 
+
+```dart
+void main() {}
+```
+
+![image](https://pub.dev/static/img/pub-dev-logo.svg)
+
+> [!NOTE]  
+> Highlights information that users should take into account, even when skimming.
+
+> [!TIP]
+> Optional information to help a user be more successful.
+
+> [!IMPORTANT]  
+> Crucial information necessary for users to succeed.
+
+> [!WARNING]  
+> Critical content demanding immediate user attention due to potential risks.
+
+> [!CAUTION]
+> Negative potential consequences of an action.

app/lib/tool/test_profile/models.dart

@@ -184,10 +184,16 @@ class GeneratedTestVersion extends TestVersion {
 
 @JsonSerializable(explicitToJson: true, includeIfNull: false)
 class TestArchiveTemplate {
+  final String? homepage;
+  final String? repository;
   final String? sdkConstraint;
+  final bool? markdownSamples;
 
   TestArchiveTemplate({
+    this.homepage,
+    this.repository,
     this.sdkConstraint,
+    this.markdownSamples,
   });
 
   factory TestArchiveTemplate.fromJson(Map<String, dynamic> json) =>
@@ -196,7 +202,10 @@ class TestArchiveTemplate {
   TestArchiveTemplate overrideWith(TestArchiveTemplate? other) {
     if (other == null) return this;
     return TestArchiveTemplate(
+      homepage: other.homepage ?? homepage,
+      repository: other.repository ?? repository,
       sdkConstraint: other.sdkConstraint ?? sdkConstraint,
+      markdownSamples: other.markdownSamples ?? markdownSamples,
     );
   }
 

app/lib/tool/test_profile/models.g.dart

@@ -132,15 +132,6 @@ <h1 class="title pub-monochrome-icon-hoverable">
                   <span>
                     <a class="-x-ago" href="" title="%%published-date%%" role="button" data-timestamp="%%millis%%">%%x-ago%%</a>
                   </span>
-                  • Latest:
-                  <span>
-                    <a href="/packages/oxygen" title="View the latest version of oxygen">1.2.0</a>
-                  </span>
-                  /
-                  <span>
-                    Prerelease:
-                    <a href="/packages/oxygen/versions/2.0.0-dev" title="Visit oxygen 2.0.0-dev page">2.0.0-dev</a>
-                  </span>
                 </div>
                 <div class="detail-tags-and-like">
                   <div class="detail-tags">
@@ -223,6 +214,90 @@ <h1 id="oxygen" class="hash-header">
                     <a href="#oxygen" class="hash-link">#</a>
                   </h1>
                   <p>Awesome package.</p>
+                  <h1 id="header-1" class="hash-header">
+                    Header 1
+                    <a href="#header-1" class="hash-link">#</a>
+                  </h1>
+                  <p>
+                    Paragraph with
+                    <code>inline code block</code>
+                    . Overall, the text content here should be long enough that it will be displayed as multiple lines. It demonstrates the line height and we may also use it to track subtle changes in the layout (maybe enable hyphens?).
+                  </p>
+                  <h2 id="header-2---also-a-longer-block-of-text-that-should-be-breaking-into-multiple-lines-even-in-desktop-view" class="hash-header">
+                    Header 2 - also a longer block of text that should be breaking into multiple lines even in desktop view
+                    <a href="#header-2---also-a-longer-block-of-text-that-should-be-breaking-into-multiple-lines-even-in-desktop-view" class="hash-link">#</a>
+                  </h2>
+                  <p>
+                    Paragraph with
+                    <strong>bold text</strong>
+                    .
+                  </p>
+                  <hr/>
+                  <p>
+                    Separated by a line, also using
+                    <em>italic formatting</em>
+                    .
+                  </p>
+                  <h3 id="header-3" class="hash-header">
+                    Header 3
+                    <a href="#header-3" class="hash-link">#</a>
+                  </h3>
+                  <p>
+                    Paragraph with
+                    <a href="https://pub.dev/">
+                      link and
+                      <code>inline code</code>
+                    </a>
+                    .
+                  </p>
+                  <h4 id="header-4">Header 4</h4>
+                  <h5 id="header-5">Header 5</h5>
+                  <h6 id="header6">Header6</h6>
+                  <blockquote>
+                    <p>Blockquote with unordered list:</p>
+                    <ul>
+                      <li>item 1</li>
+                      <li>item 2</li>
+                    </ul>
+                  </blockquote>
+                  <p>Ordered list and list nesting:</p>
+                  <ol>
+                    <li>item 1.</li>
+                    <li>
+                      item 2.
+                      <ol>
+                        <li>item 2.1.</li>
+                        <li>item 2.2.</li>
+                      </ol>
+                    </li>
+                    <li>item 3. on multiple lines</li>
+                  </ol>
+                  <pre>
+                    <code class="language-dart">void main() {}</code>
+                  </pre>
+                  <p>
+                    <img src="https://pub.dev/static/img/pub-dev-logo.svg" alt="image"/>
+                  </p>
+                  <div class="markdown-alert markdown-alert-note">
+                    <p class="markdown-alert-title">Note</p>
+                    <p>Highlights information that users should take into account, even when skimming.</p>
+                  </div>
+                  <div class="markdown-alert markdown-alert-tip">
+                    <p class="markdown-alert-title">Tip</p>
+                    <p>Optional information to help a user be more successful.</p>
+                  </div>
+                  <div class="markdown-alert markdown-alert-important">
+                    <p class="markdown-alert-title">Important</p>
+                    <p>Crucial information necessary for users to succeed.</p>
+                  </div>
+                  <div class="markdown-alert markdown-alert-warning">
+                    <p class="markdown-alert-title">Warning</p>
+                    <p>Critical content demanding immediate user attention due to potential risks.</p>
+                  </div>
+                  <div class="markdown-alert markdown-alert-caution">
+                    <p class="markdown-alert-title">Caution</p>
+                    <p>Negative potential consequences of an action.</p>
+                  </div>
                 </section>
               </div>
             </div>
@@ -297,7 +372,7 @@ <h3 class="title">More</h3>
             </p>
           </aside>
         </div>
-        <script type="application/ld+json">{"@context":"http\u003a\u002f\u002fschema.org","@type":"SoftwareSourceCode","name":"oxygen","version":"1.2.0","description":"oxygen - oxygen is awesome","url":"https\u003a\u002f\u002fpub.dev\u002fpackages\u002foxygen","dateCreated":"%%published-escaped-timestamp%%","dateModified":"%%updated-escaped-timestamp%%","programmingLanguage":"Dart","image":"https\u003a\u002f\u002fpub.dev\u002fstatic\u002fimg\u002fpub-dev-icon-cover-image.png","license":"https\u003a\u002f\u002fpub.dev\u002fpackages\u002foxygen\u002flicense"}</script>
+        <script type="application/ld+json">{"@context":"http\u003a\u002f\u002fschema.org","@type":"SoftwareSourceCode","name":"oxygen","version":"1.2.0","description":"oxygen - oxygen is awesome","url":"https\u003a\u002f\u002fpub.dev\u002fpackages\u002foxygen","dateCreated":"%%published-escaped-timestamp%%","dateModified":"%%published-escaped-timestamp%%","programmingLanguage":"Dart","image":"https\u003a\u002f\u002fpub.dev\u002fstatic\u002fimg\u002fpub-dev-icon-cover-image.png","license":"https\u003a\u002f\u002fpub.dev\u002fpackages\u002foxygen\u002flicense"}</script>
       </div>
       <div class="detail-metadata">
         <h3 class="detail-metadata-title">

app/test/frontend/golden/pkg_show_page.html

@@ -125,9 +125,12 @@ void main() {
       'package pages without homepage',
       testProfile: TestProfile(
         generatedPackages: [
-          GeneratedTestPackage(
-              name: 'pkg',
-              versions: [GeneratedTestVersion(version: '1.0.0-nohomepage')]),
+          GeneratedTestPackage(name: 'pkg', versions: [
+            GeneratedTestVersion(
+              version: '1.0.0',
+              template: TestArchiveTemplate(homepage: ''),
+            ),
+          ]),
         ],
         defaultUser: '[email protected]',
       ),

app/test/frontend/handlers/package_test.dart

@@ -142,8 +142,24 @@ void main() {
     );
 
     testWithProfile(
-      'package show page',
+      'package readme page with markdown',
       processJobsWithFakeRunners: true,
+      testProfile: TestProfile(
+        defaultUser: '[email protected]',
+        generatedPackages: [
+          GeneratedTestPackage(
+            name: 'oxygen',
+            versions: [
+              GeneratedTestVersion(
+                version: '1.2.0',
+                template: TestArchiveTemplate(
+                  markdownSamples: true,
+                ),
+              ),
+            ],
+          ),
+        ],
+      ),
       fn: () async {
         final data = await withFakeAuthRequestContext(
           adminAtPubDevEmail,

app/test/frontend/templates_test.dart

@@ -250,11 +250,13 @@ class TestBrowserSession {
         }
       }
 
-      if (!rs.url.startsWith('data:')) {
+      if (!rs.url.startsWith('data:') &&
+          // exempt the image URL from markdown_samples.md
+          rs.url != 'https://pub.dev/static/img/pub-dev-logo.svg') {
         final uri = Uri.parse(rs.url);
         if (uri.pathSegments.length > 1 && uri.pathSegments.first == 'static') {
           if (!uri.pathSegments[1].startsWith('hash-')) {
-            serverErrors.add('Static ${rs.url} is without hash URL.');
+            serverErrors.add('Static URL ${rs.url} is without hash segment.');
           }
 
           final cacheHeader = rs.headers[HttpHeaders.cacheControlHeader];

pkg/pub_integration/lib/src/test_browser.dart

@@ -37,6 +37,9 @@ void main() {
                 {
                   'name': 'retry',
                   'versions': ['3.1.0'],
+                  'template': {
+                    'markdownSamples': true,
+                  },
                 },
                 {'name': '_dummy_pkg'},
               ],