Merge pull request #71 from AngleSharp/devel

Release 0.15.1

Author: FlorianRappl

.github/workflows/ci.yml

@@ -5,8 +5,45 @@ on: [push, pull_request]
 env:
   GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
   NUGET_API_KEY: ${{ secrets.NUGET_API_KEY }}
+  DOCS_PATH: ${{ secrets.DOCS_PATH }}
+  DOCS_BRANCH: ${{ secrets.DOCS_BRANCH }}
 
 jobs:
+  can_document:
+    runs-on: ubuntu-latest
+    outputs:
+      value: ${{ steps.check_job.outputs.value }}
+    steps:
+      - name: Checks whether documentation can be built
+        id: check_job
+        run: |
+            echo "value: ${{ env.DOCS_PATH != null && github.ref == env.DOCS_BRANCH }}"
+            echo "::set-output name=value::${{ env.DOCS_PATH != null && github.ref == env.DOCS_BRANCH }}"
+
+  documentation:
+    needs: [can_document]
+    runs-on: ubuntu-latest
+    if: needs.can_document.outputs.value == 'true'
+
+    steps:
+    - uses: actions/checkout@v2
+
+    - name: Use Node.js
+      uses: actions/setup-node@v1
+      with:
+        node-version: "14.x"
+        registry-url: 'https://registry.npmjs.org'
+
+    - name: Install Dependencies
+      run: |
+        cd $DOCS_PATH
+        npm install
+
+    - name: Deploy Doclet
+      run: |
+        cd $DOCS_PATH
+        npx pilet publish --fresh --url https://feed.piral.cloud/api/v1/pilet/anglesharp --api-key ${{ secrets.PIRAL_FEED_KEY }}
+
   linux:
     runs-on: ubuntu-latest
 
@@ -24,7 +61,7 @@ jobs:
 
     - name: Build
       run: |
-        if ($env:GITHUB_REF -eq "refs/heads/master") {
+        if ($env:GITHUB_REF -eq "refs/heads/main") {
           .\build.ps1 -Target Publish
         } elseif ($env:GITHUB_REF -eq "refs/heads/devel") {
           .\build.ps1 -Target PrePublish

.gitignore

@@ -75,6 +75,8 @@ artifacts/
 [Tt]ools/
 ![Tt]ools/packages.config
 TestResults/
+node_modules
+package-lock.json
 *.nuget.targets
 *.nuget.props
 *.nupkg

CHANGELOG.md

@@ -1,3 +1,9 @@
+# 0.15.1
+
+Release on Sunday, June 6 2021.
+
+- Extended values for the `width` declaration (#69)
+
 # 0.15.0
 
 Released on Thursday, April 22 2021.

CONTRIBUTORS.md

@@ -9,6 +9,7 @@ AngleSharp.Css contains code written by (in order of first pull request / commit
 * [Jochen Kühner](https://github.com/jogibear9988)
 * [Tom Hazell](https://github.com/The-Nutty)
 * [Michael Ganss](https://github.com/mganss)
+* [Gérald Barré](https://github.com/meziantou)
 
 Without these awesome people AngleSharp.Css could not exist. Thanks to everyone for your contributions! :beers:
 

doc/index.md

@@ -0,0 +1,5 @@
+# AngleSharp.Css Documentation
+
+We have more detailed information regarding the following subjects:
+
+- [API Documentation](tutorials/01-API.md)

docs/README.md

@@ -0,0 +1,62 @@
+---
+title: "Getting Started"
+section: "AngleSharp.Css"
+---
+# Getting Started
+
+## Requirements
+
+AngleSharp.Css comes currently in two flavors: on Windows for .NET 4.6 and in general targetting .NET Standard 2.0 platforms.
+
+Most of the features of the library do not require .NET 4.6, which means you could create your own fork and modify it to work with previous versions of the .NET-Framework.
+
+You need to have AngleSharp installed already. This could be done via NuGet:
+
+```ps1
+Install-Package AngleSharp
+```
+
+## Getting AngleSharp.Css over NuGet
+
+The simplest way of integrating AngleSharp.Css to your project is by using NuGet. You can install AngleSharp.Css by opening the package manager console (PM) and typing in the following statement:
+
+```ps1
+Install-Package AngleSharp.Css
+```
+
+You can also use the graphical library package manager ("Manage NuGet Packages for Solution"). Searching for "AngleSharp.Css" in the official NuGet online feed will find this library.
+
+## Setting up AngleSharp.Css
+
+To use AngleSharp.Css you need to add it to your `Configuration` coming from AngleSharp itself.
+
+If you just want a configuration *that works* (as close as possible to real browsers) you should use the following code:
+
+```cs
+var config = Configuration.Default
+    .WithCss(); // from AngleSharp.Css
+```
+
+This will register a parser for CSS related content. The CSS parsing options and more could be set with parameters of the `WithCss` method.
+
+Alternatively, all the (desired) parts may be registered individually as well. That mostly boils down to three elementary parts:
+
+- A CSS parser (implementing the `ICssParser` interface, e.g., `CssParser`)
+- A factory for creating CSS declarations (`IDeclarationFactory`)
+- The styling service that can handle CSS documents, see `CssStylingService`
+
+For an interactive DOM (i.e., to handle `style` attribute changes in the HTML document) an observer needs to be registered as well.
+
+Furthermore, for some CSSOM features (e.g., media queries) a render device is required.
+
+```cs
+var config = Configuration.Default
+    .WithCss()
+    .WithRenderDevice(new DefaultRenderDevice
+    {
+        DeviceHeight = 768,
+        DeviceWidth = 1024,
+    });
+```
+
+If no specific `IRenderDevice` (e.g., via creating an `DefaultRenderDevice` object) instance is created a default implementation will be set.

docs/general/01-Basics.md

@@ -1,3 +1,7 @@
+---
+title: "Types of Values"
+section: "AngleSharp.Css"
+---
 # Types of Values
 
 For details see [CSS2 specification](https://www.w3.org/TR/CSS2/cascade.html#value-stages).

doc/Values.md renamed to docs/general/02-Values.md

@@ -1,3 +1,7 @@
+---
+title: "API Documentation"
+section: "AngleSharp.Css"
+---
 # API Documentation
 
 ## CSSOM - Basics
@@ -25,7 +29,7 @@ AngleSharp uses converters to parse a given source to an `ICssValue` instance. T
 
 The `ICssValue` interface is split in various interfaces with respect to their usage.
 
-![The CSSOM Value Tree](cssom-value-tree.png)
+![The CSSOM Value Tree](./cssom-value-tree.png)
 
 A converter may also implement the `IValueAggregator` interface, which indicates that the declaration behind it is actually a shorthand that can additionally merge values into a shorthand representation or split the shorthand representation into the atoms described by the shorthand.
 

doc/API.md renamed to docs/tutorials/01-API.md

@@ -0,0 +1,11 @@
+---
+title: "Examples"
+section: "AngleSharp.Css"
+---
+# Example Code
+
+This is a (growing) list of examples for every-day usage of AngleSharp.Css.
+
+## Some Example
+
+(tbd)

docs/tutorials/02-Examples.md

@@ -0,0 +1,9 @@
+---
+title: "Questions"
+section: "AngleSharp.Css"
+---
+# Frequently Asked Questions
+
+## What to ask?
+
+(tbd)

docs/tutorials/03-Questions.md

@@ -0,0 +1,28 @@
+{
+  "name": "AngleSharp.Css",
+  "author": "Florian Rappl",
+  "branch": "devel",
+  "repositoryUrl": "https://github.com/AngleSharp/AngleSharp.Css",
+  "rootDir": "../../",
+  "outputDir": "./dist",
+  "sitemap": {
+    "general": {
+      "sections": [
+        {
+          "generator": "markdown",
+          "segment": "css",
+          "dir": "general"
+        }
+      ]
+    },
+    "docs": {
+      "sections": [
+        {
+          "generator": "markdown",
+          "segment": "css",
+          "dir": "tutorials"
+        }
+      ]
+    }
+  }
+}

doc/cssom-value-tree.png renamed to docs/tutorials/cssom-value-tree.png

@@ -0,0 +1,58 @@
+{
+  "name": "@anglesharp/css",
+  "version": "0.16.0",
+  "preview": true,
+  "description": "The doclet for the AngleSharp.Css documentation.",
+  "keywords": [
+    "pilet"
+  ],
+  "dependencies": {},
+  "devDependencies": {
+    "@anglesharp/website": "1.0.0",
+    "@types/react": "^17.0.5",
+    "@types/react-dom": "^17.0.5",
+    "@types/react-router": "latest",
+    "@types/react-router-dom": "^5.1.7",
+    "@types/node": "^15.3.0",
+    "typescript": "^4.2.4",
+    "@dbeining/react-atom": "4.1.19",
+    "@libre/atom": "1.3.3",
+    "history": "4.10.1",
+    "react": "17.0.2",
+    "react-dom": "17.0.2",
+    "react-router": "5.2.0",
+    "react-router-dom": "5.2.0",
+    "tslib": "2.2.0",
+    "path-to-regexp": "1.8.0",
+    "piral-cli": "^0.13.3-pre.2480",
+    "piral-cli-parcel": "^0.13.3-pre.2480"
+  },
+  "peerDependencies": {
+    "@dbeining/react-atom": "*",
+    "@libre/atom": "*",
+    "history": "*",
+    "react": "*",
+    "react-dom": "*",
+    "react-router": "*",
+    "react-router-dom": "*",
+    "tslib": "*",
+    "path-to-regexp": "*",
+    "@anglesharp/website": "*"
+  },
+  "scripts": {
+    "start": "pilet debug",
+    "build": "pilet build",
+    "upgrade": "pilet upgrade"
+  },
+  "main": "dist/index.js",
+  "files": [
+    "dist"
+  ],
+  "piral": {
+    "comment": "Keep this section to use the Piral CLI.",
+    "name": "@anglesharp/website"
+  },
+  "peerModules": [
+    "piral-docs-tools/components"
+  ]
+}

src/AngleSharp.Css.Docs/docs.config.json

@@ -0,0 +1,7 @@
+import { PiletApi } from 'piral-docs-tools';
+
+const createDoclet = require('piral-docs-tools/doclet');
+
+export function setup(api: PiletApi) {
+  createDoclet(api);
+}

src/AngleSharp.Css.Docs/package.json

@@ -0,0 +1,25 @@
+{
+  "compilerOptions": {
+    "declaration": true,
+    "noImplicitAny": false,
+    "removeComments": false,
+    "noLib": false,
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "target": "es6",
+    "sourceMap": true,
+    "outDir": "./dist",
+    "skipLibCheck": true,
+    "lib": ["dom", "es2018"],
+    "moduleResolution": "node",
+    "module": "esnext",
+    "jsx": "react",
+    "importHelpers": true
+  },
+  "include": [
+    "./src"
+  ],
+  "exclude": [
+    "node_modules"
+  ]
+}

src/AngleSharp.Css.Docs/src/index.tsx

@@ -0,0 +1,45 @@
+namespace AngleSharp.Css.Tests.Declarations
+{
+    using NUnit.Framework;
+    using static CssConstructionFunctions;
+
+    [TestFixture]
+    public class CssWidthPropertyTests
+    {
+        [Test]
+        public void CssWidthPropertyAutoLegal()
+        {
+            var snippet = "width: auto";
+            var property = ParseDeclaration(snippet);
+            Assert.AreEqual("width", property.Name);
+            Assert.IsFalse(property.IsImportant);
+            Assert.IsFalse(property.IsInherited);
+            Assert.IsTrue(property.HasValue);
+            Assert.AreEqual("auto", property.Value);
+        }
+        
+        [Test]
+        public void CssWidthPropertyFitContentLegal()
+        {
+            var snippet = "width: fit-content";
+            var property = ParseDeclaration(snippet);
+            Assert.AreEqual("width", property.Name);
+            Assert.IsFalse(property.IsImportant);
+            Assert.IsFalse(property.IsInherited);
+            Assert.IsTrue(property.HasValue);
+            Assert.AreEqual("fit-content", property.Value);
+        }
+
+        [Test]
+        public void CssWidthPropertyValueInPxLegal()
+        {
+            var snippet = "width: 42px";
+            var property = ParseDeclaration(snippet);
+            Assert.AreEqual("width", property.Name);
+            Assert.IsFalse(property.IsImportant);
+            Assert.IsFalse(property.IsInherited);
+            Assert.IsTrue(property.HasValue);
+            Assert.AreEqual("42px", property.Value);
+        }
+    }
+}

src/AngleSharp.Css.Docs/tsconfig.json

@@ -1566,5 +1566,10 @@ public static class CssKeywords
         /// The closed keyword.
         /// </summary>
         public static readonly String Closed = "closed";
+
+        /// <summary>
+        /// The fit-content keyword.
+        /// </summary>
+        public static readonly String FitContent = "fit-content";
     }
 }