<?xml version="1.0" encoding="utf-8"?>
<t:test xmlns:t="http://xproc.org/ns/testsuite/3.0"
        xml:base="/rr-006.xml"
        name="rr-006.xml"
        expected="pass">
   <t:info>
      <t:title>railroad-006</t:title>
      <t:revision-history>
         <t:revision>
            <t:date>2025-01-30</t:date>
            <t:author>
               <t:name>Norm Tovey-Walsh</t:name>
            </t:author>
            <t:description xmlns="http://www.w3.org/1999/xhtml">
               <p>Created test.</p>
            </t:description>
         </t:revision>
      </t:revision-history>
   </t:info>
   <t:description xmlns="http://www.w3.org/1999/xhtml">
      <p>Tests that cx:railroad produces HTML.</p>
   </t:description>
   <t:pipeline>
      <p:declare-step xmlns:cx="http://xmlcalabash.com/ns/extensions"
                      xmlns:p="http://www.w3.org/ns/xproc"
                      name="main"
                      version="3.0">
         <p:import href="https://xmlcalabash.com/ext/library/railroad.xpl"/>
         <p:output port="result" sequence="true" pipe="html"/>
         <cx:railroad inline-literals="false">
            <p:with-input>
               <p:inline content-type="text/plain">
S ::= A B
A ::= "a"
B ::= B1 | B2
B1 ::= B2
B2 ::= "b"
      </p:inline>
            </p:with-input>
         </cx:railroad>
      </p:declare-step>
   </t:pipeline>
   <t:schematron>
      <s:schema xmlns:s="http://purl.oclc.org/dsdl/schematron" queryBinding="xslt2">
         <s:ns prefix="svg" uri="http://www.w3.org/2000/svg"/>
         <s:ns prefix="h" uri="http://www.w3.org/1999/xhtml"/>
         <s:pattern>
            <s:rule context="/">
               <s:assert test="h:html">HTML not returned.</s:assert>
               <s:assert test="//svg:svg">No SVG returned.</s:assert>
            </s:rule>
         </s:pattern>
      </s:schema>
   </t:schematron>
   <t:result name="rr-006.xml">
      <html xmlns="http://www.w3.org/1999/xhtml">
         <head>
            <meta http-equiv="Content-Type"
                  content="application/xhtml+xml; charset=UTF-8"/>
            <meta name="generator" content="Railroad Diagram Generator 2.5"/>
            <style type="text/css" xml:space="preserve">
    ::-moz-selection
    {
      color: #FFFCF0;
      background: #0F0C00;
    }
    ::selection
    {
      color: #FFFCF0;
      background: #0F0C00;
    }
    body
    {
      font: normal 12px Verdana, sans-serif;
      color: #0F0C00;
      background: #FFFCF0;
    }
    .ebnf a
    {
      text-decoration: none;
    }
    .ebnf a:hover
    {
      color: #050400;
      text-decoration: underline;
    }
    .signature
    {
      color: #806600;
      font-size: 11px;
      text-align: right;
    }
    a:link, a:visited
    {
      color: #0F0C00;
    }
    a:link.signature, a:visited.signature
    {
      color: #806600;
    }
    div.ebnf
    {
      padding: 10px;
      background: #FFF6D1;
      width: 992px;
    }
    .ebnf div
    {
      padding-left: 13ch;
      text-indent: -13ch;
    }
    .ebnf code
    {
      font:12px SFMono-Regular,Consolas,Liberation Mono,Menlo,Courier,monospace;
    }
  </style>
            <svg xmlns="http://www.w3.org/2000/svg">
               <defs>
                  <style type="text/css" xml:space="preserve">
    @namespace "http://www.w3.org/2000/svg";
    .line                 {fill: none; stroke: #332900; stroke-width: 1;}
    .bold-line            {stroke: #141000; shape-rendering: crispEdges; stroke-width: 2;}
    .thin-line            {stroke: #1F1800; shape-rendering: crispEdges}
    .filled               {fill: #332900; stroke: none;}
    text.terminal         {font-family: Verdana, Sans-serif;
                            font-size: 12px;
                            fill: #141000;
                            font-weight: bold;
                          }
    text.nonterminal      {font-family: Verdana, Sans-serif;
                            font-size: 12px;
                            fill: #1A1400;
                            font-weight: normal;
                          }
    text.regexp           {font-family: Verdana, Sans-serif;
                            font-size: 12px;
                            fill: #1F1800;
                            font-weight: normal;
                          }
    rect, circle, polygon {fill: #332900; stroke: #332900;}
    rect.terminal         {fill: #ffdb4d; stroke: #332900; stroke-width: 1;}
    rect.nonterminal      {fill: #FFEC9E; stroke: #332900; stroke-width: 1;}
    rect.text             {fill: none; stroke: none;}
    polygon.regexp        {fill: #FFF4C7; stroke: #332900; stroke-width: 1;}
  </style>
               </defs>
            </svg>
         </head>
         <body>
            <p style="font-size: 14px; font-weight:bold">
               <a name="S" shape="rect">S:</a>
            </p>
            <svg xmlns="http://www.w3.org/2000/svg" width="135" height="37">
               <polygon points="9 17 1 13 1 21"/>
               <polygon points="17 17 9 13 9 21"/>
               <a xmlns:xlink="http://www.w3.org/1999/xlink"
                  xlink:href="#A"
                  xlink:title="A"
                  shape="rect">
                  <rect x="31" y="3" width="28" height="32"/>
                  <rect x="29" y="1" width="28" height="32" class="nonterminal"/>
                  <text class="nonterminal" x="39" y="21">A</text>
               </a>
               <a xmlns:xlink="http://www.w3.org/1999/xlink"
                  xlink:href="#B"
                  xlink:title="B"
                  shape="rect">
                  <rect x="79" y="3" width="28" height="32"/>
                  <rect x="77" y="1" width="28" height="32" class="nonterminal"/>
                  <text class="nonterminal" x="87" y="21">B</text>
               </a>
               <path class="line"
                     d="m17 17 h2 m0 0 h10 m28 0 h10 m0 0 h10 m28 0 h10 m3 0 h-3"/>
               <polygon points="125 17 133 13 133 21"/>
               <polygon points="125 17 117 13 117 21"/>
            </svg>
            <p>
               <div class="ebnf">
                  <code>
                     <div>
                        <a href="#S" title="S" shape="rect">S</a>        ::= <a href="#A" title="A" shape="rect">A</a>
                        <a href="#B" title="B" shape="rect">B</a>
                     </div>
                  </code>
               </div>
            </p>
            <p>no references</p>
            <br clear="none"/>
            <p style="font-size: 14px; font-weight:bold">
               <a name="A" shape="rect">A:</a>
            </p>
            <svg xmlns="http://www.w3.org/2000/svg" width="87" height="37">
               <polygon points="9 17 1 13 1 21"/>
               <polygon points="17 17 9 13 9 21"/>
               <rect x="31" y="3" width="28" height="32" rx="10"/>
               <rect x="29"
                     y="1"
                     width="28"
                     height="32"
                     class="terminal"
                     rx="10"/>
               <text class="terminal" x="39" y="21">a</text>
               <path class="line" d="m17 17 h2 m0 0 h10 m28 0 h10 m3 0 h-3"/>
               <polygon points="77 17 85 13 85 21"/>
               <polygon points="77 17 69 13 69 21"/>
            </svg>
            <p>
               <div class="ebnf">
                  <code>
                     <div>
                        <a href="#A" title="A" shape="rect">A</a>        ::= 'a'</div>
                  </code>
               </div>
            </p>
            <p>referenced by:
         <ul>
                  <li>
                     <a href="#S" title="S" shape="rect">S</a>
                  </li>
               </ul>
            </p>
            <br clear="none"/>
            <p style="font-size: 14px; font-weight:bold">
               <a name="B" shape="rect">B:</a>
            </p>
            <svg xmlns="http://www.w3.org/2000/svg" width="135" height="81">
               <polygon points="9 17 1 13 1 21"/>
               <polygon points="17 17 9 13 9 21"/>
               <a xmlns:xlink="http://www.w3.org/1999/xlink"
                  xlink:href="#B1"
                  xlink:title="B1"
                  shape="rect">
                  <rect x="51" y="3" width="36" height="32"/>
                  <rect x="49" y="1" width="36" height="32" class="nonterminal"/>
                  <text class="nonterminal" x="59" y="21">B1</text>
               </a>
               <a xmlns:xlink="http://www.w3.org/1999/xlink"
                  xlink:href="#B2"
                  xlink:title="B2"
                  shape="rect">
                  <rect x="51" y="47" width="36" height="32"/>
                  <rect x="49" y="45" width="36" height="32" class="nonterminal"/>
                  <text class="nonterminal" x="59" y="65">B2</text>
               </a>
               <path class="line"
                     d="m17 17 h2 m20 0 h10 m36 0 h10 m-76 0 h20 m56 0 h20 m-96 0 q10 0 10 10 m76 0 q0 -10 10 -10 m-86 10 v24 m76 0 v-24 m-76 24 q0 10 10 10 m56 0 q10 0 10 -10 m-66 10 h10 m36 0 h10 m23 -44 h-3"/>
               <polygon points="125 17 133 13 133 21"/>
               <polygon points="125 17 117 13 117 21"/>
            </svg>
            <p>
               <div class="ebnf">
                  <code>
                     <div>
                        <a href="#B" title="B" shape="rect">B</a>        ::= <a href="#B1" title="B1" shape="rect">B1</a>
                     </div>
                     <div>           | <a href="#B2" title="B2" shape="rect">B2</a>
                     </div>
                  </code>
               </div>
            </p>
            <p>referenced by:
         <ul>
                  <li>
                     <a href="#S" title="S" shape="rect">S</a>
                  </li>
               </ul>
            </p>
            <br clear="none"/>
            <p style="font-size: 14px; font-weight:bold">
               <a name="B1" shape="rect">B1:</a>
            </p>
            <svg xmlns="http://www.w3.org/2000/svg" width="95" height="37">
               <polygon points="9 17 1 13 1 21"/>
               <polygon points="17 17 9 13 9 21"/>
               <a xmlns:xlink="http://www.w3.org/1999/xlink"
                  xlink:href="#B2"
                  xlink:title="B2"
                  shape="rect">
                  <rect x="31" y="3" width="36" height="32"/>
                  <rect x="29" y="1" width="36" height="32" class="nonterminal"/>
                  <text class="nonterminal" x="39" y="21">B2</text>
               </a>
               <path class="line" d="m17 17 h2 m0 0 h10 m36 0 h10 m3 0 h-3"/>
               <polygon points="85 17 93 13 93 21"/>
               <polygon points="85 17 77 13 77 21"/>
            </svg>
            <p>
               <div class="ebnf">
                  <code>
                     <div>
                        <a href="#B1" title="B1" shape="rect">B1</a>       ::= <a href="#B2" title="B2" shape="rect">B2</a>
                     </div>
                  </code>
               </div>
            </p>
            <p>referenced by:
         <ul>
                  <li>
                     <a href="#B" title="B" shape="rect">B</a>
                  </li>
               </ul>
            </p>
            <br clear="none"/>
            <p style="font-size: 14px; font-weight:bold">
               <a name="B2" shape="rect">B2:</a>
            </p>
            <svg xmlns="http://www.w3.org/2000/svg" width="87" height="37">
               <polygon points="9 17 1 13 1 21"/>
               <polygon points="17 17 9 13 9 21"/>
               <rect x="31" y="3" width="28" height="32" rx="10"/>
               <rect x="29"
                     y="1"
                     width="28"
                     height="32"
                     class="terminal"
                     rx="10"/>
               <text class="terminal" x="39" y="21">b</text>
               <path class="line" d="m17 17 h2 m0 0 h10 m28 0 h10 m3 0 h-3"/>
               <polygon points="77 17 85 13 85 21"/>
               <polygon points="77 17 69 13 69 21"/>
            </svg>
            <p>
               <div class="ebnf">
                  <code>
                     <div>
                        <a href="#B2" title="B2" shape="rect">B2</a>       ::= 'b'</div>
                  </code>
               </div>
            </p>
            <p>referenced by:
         <ul>
                  <li>
                     <a href="#B" title="B" shape="rect">B</a>
                  </li>
                  <li>
                     <a href="#B1" title="B1" shape="rect">B1</a>
                  </li>
               </ul>
            </p>
            <br clear="none"/>
            <hr/>
            <p>
               <table border="0" class="signature">
                  <tr>
                     <td style="width: 100%" rowspan="1" colspan="1"> </td>
                     <td valign="top" rowspan="1" colspan="1">
                        <nobr class="signature">... generated by <a name="Railroad-Diagram-Generator"
                              class="signature"
                              title="https://www.bottlecaps.de/rr"
                              href="https://www.bottlecaps.de/rr"
                              target="_blank"
                              shape="rect">RR - Railroad Diagram Generator</a>
                        </nobr>
                     </td>
                     <td rowspan="1" colspan="1">
                        <a name="Railroad-Diagram-Generator"
                           title="https://www.bottlecaps.de/rr"
                           href="https://www.bottlecaps.de/rr"
                           target="_blank"
                           shape="rect">
                           <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16">
                              <g transform="scale(0.178)">
                                 <circle cx="45" cy="45" r="45" style="stroke:none; fill:#FFCC00"/>
                                 <circle cx="45"
                                         cy="45"
                                         r="42"
                                         style="stroke:#332900; stroke-width:2px; fill:#FFCC00"/>
                                 <line x1="15"
                                       y1="15"
                                       x2="75"
                                       y2="75"
                                       stroke="#332900"
                                       style="stroke-width:9px;"/>
                                 <line x1="15"
                                       y1="75"
                                       x2="75"
                                       y2="15"
                                       stroke="#332900"
                                       style="stroke-width:9px;"/>
                                 <text x="7"
                                       y="54"
                                       style="font-size:26px; font-family:Arial, Sans-serif; font-weight:bold; fill: #332900">R</text>
                                 <text x="64"
                                       y="54"
                                       style="font-size:26px; font-family:Arial, Sans-serif; font-weight:bold; fill: #332900">R</text>
                              </g>
                           </svg>
                        </a>
                     </td>
                  </tr>
               </table>
            </p>
         </body>
      </html>
   </t:result>
</t:test>
