diff --git a/spec.bs b/spec.bs index 87c5689..99fc9ea 100644 --- a/spec.bs +++ b/spec.bs @@ -92,12 +92,54 @@ table { top: -0.8em; left: -0.8em; } + +/* props from https://resources.whatwg.org/standard.css */ +dl.props { display: grid; grid-template-columns: max-content auto; row-gap: 0.25em; column-gap: 1em; } +dl.props > dt { grid-column-start: 1; margin: 0; } +dl.props > dd { grid-column-start: 2; margin: 0; } +p + dl.props { margin-top: -0.5em; }

The {{URLPattern}} class

+A {{URLPattern}} consists of several [=components=], each of which represents a [=/pattern string|pattern=] which could be matched against the corresponding component of a [=/URL=]. + +It can be constructed using a string for each component, or from a shorthand string. It can optionally be resolved relative to a base URL. + +
+ The shorthand "`https://example.com/:category/*`" corresponds to the following components: + +
+ : [=URLPattern/protocol component|protocol=] + :: "`https`" + : [=URLPattern/username component|username=] + :: "" + : [=URLPattern/password component|password=] + :: "" + : [=URLPattern/hostname component|hostname=] + :: "`example.com`" + : [=URLPattern/port component|port=] + :: "" + : [=URLPattern/pathname component|pathname=] + :: "`/:category/*`" + : [=URLPattern/search component|search=] + :: "" + : [=URLPattern/hash component|hash=] + :: "" +
+ + It matches the following URLs: + * `https://example.com/products/` + * `https://example.com/blog/our-greatest-product-ever` + + It does not match the following URLs: + * `https://example.com/` + * `http://example.com/products/` + * `https://example.com:8443/blog/our-greatest-product-ever` +
+ typedef (USVString or URLPatternInit) URLPatternInput; @@ -833,6 +875,18 @@ To <dfn>compute protocol matches a special scheme flag</dfn> given a [=construct A <dfn>pattern string</dfn> is a string that is written to match a set of target strings. A <dfn for="pattern string">well formed</dfn> pattern string conforms to a particular pattern syntax. This pattern syntax is directly based on the syntax used by the popular [path-to-regexp](https://github.com/pillarjs/path-to-regexp) JavaScript library. +It can be [=parse a pattern string|parsed=] to produce a [=/part list=] which describes, in order, what must appear in a component string for the pattern string to match. + +<div class="example"> + Pattern strings can contain capture groups, which by default match the shortest possible string, up to a component-specific separator (`/` in the pathname, `.` in the hostname). For example, the pathname pattern "`/blog/:title`" will match "`/blog/hello-world`" but not "`/blog/2012/02`". + + A regular expression can also be used instead, so the pathname pattern "`/blog/:year(\\d+)/:month(\\d+)`" will match "`/blog/2012/02`". + + A group can also be made optional, or repeated, by using a modifier. For example, the pathname pattern "`/products/:id?"` will match both "`/products`" and "`/products/2`" (but not "`/products/`"). In the pathname specifically, groups automatically require a leading `/`; to avoid this, the group can be explicitly deliminated, as in the pathname pattern "`/products/{:id}?`". + + A full wildcard `*` can also be used to match as much as possible, as in the pathname pattern "`/products/*`". +</div> + <h3 id=parsing-patterns>Parsing Patterns</h3> <h4 id=tokens>Tokens</h4>