Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
103 changes: 103 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,108 @@
# Changelog

# v1.6.6

## Fixes

- [x] parsing aspect ratio using a single number
- [x] bugs in calc()
- [x] computing media range in container at-rule

```css

@media (aspect-ratio: 1.77) {
html {
background-color: cyan;
}
}

body {
left: sin(45deg);
left: cos(45deg);
left: tan(45deg);
left: asin(0.5);
left: acos(0.5);
left: atan(10);
left: atan2(-1, 1);
}

p {
font-size: calc(pow(10, 12) * 1rem);
font-size: calc(sqrt(100) * 1rem);
font-size: calc(hypot(3, 4) * 1rem);
font-size: calc(log(10) * 1rem);
font-size: calc(exp(10) * 1rem);
}


p {
color: alpha(from red / calc(alpha * 0.5));
}
p {
font-size: calc(pow(e, pi) * 1rem);
}

@container (min-width: 700px) {
.container {

display: grid;
}
}

@container (max-width: 1400px) {
.container {

display: grid;
}
}

@container (min-width: 700px) and (max-width: 1400px) {
.container {

display: grid;
/* styles applied when a container is at least 700px */
}
}

```
is now computed as

```css
@media (aspect-ratio:1.77) {
html {
background-color: cyan
}
}
body {
left: .707107;
left: .707107;
left: 1;
left: 30deg;
left: 60deg;
left: .234turn;
left: -45deg
}
p {
font-size: 23.140693rem;
color: #ff000080
}
@container (width>=700px) {
.container {
display: grid
}
}
@container (width<=1400px) {
.container {
display: grid
}
}
@container (700px<=width<=1400px) {
.container {
display: grid
}
}
```

# v1.6.5

## New
Expand Down
119 changes: 119 additions & 0 deletions CONTRIBUTING.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,119 @@
# Contributing

Thanks for your interest in contributing to CSS Parser. This guide explains how to get the project running locally, update its generated configuration data, run the checks, and submit a change. It is intended to help new contributors get started and make contributions easier to review.

## Get the source

1. Fork the repository on GitHub.
2. Clone your fork and enter the project directory:

```sh
git clone https://github.com/<your-user-name>/css-parser.git
cd css-parser
```

3. Add the upstream repository and install the root project dependencies:

```sh
git remote add upstream https://github.com/tbela99/css-parser.git
npm install
```

4. Create a branch for your change:

```sh
git switch -c descriptive-branch-name
```

Use a current Node.js release compatible with the project dependencies.

## Update generated configuration

The repository includes scripts for refreshing generated CSS property and syntax data. Run them from the project root:

```sh
npm run config-update
npm run syntax-update
```

`config-update` regenerates `src/data/properties.json`. `syntax-update` regenerates `src/data/validation.json` from upstream CSS data and therefore requires an internet connection. Review the generated changes and include them when they are relevant to your contribution.

## Building

Run the build command:

```sh
npm run build
```

Validate your changes before committing using deno:

```sh
deno publish --dry-run
```

## Run tests

Run the complete Node.js and browser test suites before submitting a change:

```sh
npm test
```

For a quicker, focused check, run either suite:

```sh
npm run test:node
npm run test:web
```

The browser tests use Playwright with Chromium, Firefox, and WebKit. Install the required browsers if Playwright reports that they are missing.

For debugging, run either suite:

```sh
npm run debug:node
npm run debug:web
```
## Check code coverage

Generate Node.js coverage reports with:

```sh
npm run test:cov
```

The command prints a text summary and writes an HTML report under `coverage/`. Browser coverage can be collected separately with:

```sh
npm run test:web-cov
```

When changing behavior, add or update tests that exercise it and use the coverage reports to spot untested paths.

## Run the benchmark

The benchmark has its own dependencies and must be run from the `benchmark/` directory:

```sh
cd benchmark
npm install
npm run all
```

This computes output sizes, runs the timing benchmarks, and generates `benchmark/results/benchmark.html`. Open that report to inspect the results. To run individual stages, use `npm run sizes`, `npm run bench`, or `npm run report` from `benchmark/`.

## Open a pull request

1. Review your changes and make sure no unrelated generated files or benchmark results are included.
2. Run the relevant tests; include coverage or benchmark results when they help explain the change.
3. Push your branch to your fork:

```sh
git push -u origin descriptive-branch-name
```

4. Open a pull request on GitHub against `tbela99/css-parser`'s `master` branch.
5. In the pull request description, explain the problem and the proposed change, link any related issue, and list the checks you ran. Include before-and-after benchmark results for performance-related changes.

Keep each pull request focused, and be ready to discuss or revise the change during review.
4 changes: 2 additions & 2 deletions benchmark/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@
"all": "npm run sizes && npm run bench; npm run report"
},
"dependencies": {
"@tbela99/css-parser": "^1.6.5",
"@tbela99/css-parser2": "github:tbela99/css-parser#b74aa264",
"@tbela99/css-parser": "^1.6.6",
"@tbela99/css-parser2": "github:tbela99/css-parser#2a765db",
"clean-css": "^5.3.3",
"css-tree": "^3.2.1",
"cssnano": "^9.0.5",
Expand Down
Loading
Loading