Giter Site home page Giter Site logo

css-grammar-raku's Introduction

[Raku CSS Project] / [CSS-Grammar Module]

CSS-Grammar-raku

CSS::Grammar is a set of Raku grammars for the W3C family of CSS standards.

It aims to implement a reasonable portion of the base grammars with an emphasis on:

  • support for CSS1, CSS2.1 and CSS3
  • forward compatibility rules, scanning and error recovery

This module performs generic parsing of declarations in style-sheet rules.

Contents

Base Grammars

  • CSS::Grammar::CSS1 - CSS 1.0 compatible grammar
  • CSS::Grammar::CSS21 - CSS 2.1 compatible grammar
  • CSS::Grammar::CSS3 - CSS 3.0 (core) compatible grammar

The CSS 3.0 core grammar, CSS::Grammar::CSS3, is based on CSS2.1; it understands:

  • #hex and rgb(...) colors; but not rgba(..), hsl(...), hsla(...) or named colors
  • basic @media at-rules; but not advanced media queries, resolutions or embedded @page rules.
  • basic @page page description rules
  • basic css3 level selectors

Parser Actions

CSS::Grammar::Actions can be used with in conjunction with any of the CSS1 CSS21 or CSS3 base grammars. It produces an abstract syntax tree (AST), plus warnings for any unexpected input.

use v6;
use CSS::Grammar::CSS3;
use CSS::Grammar::Actions;

my $css = 'H1 { color: blue; gunk }';

my $actions =  CSS::Grammar::Actions.new;
my $p = CSS::Grammar::CSS3.parse($css, :actions($actions));
.note for $actions.warnings;
say "H1: " ~ $p.ast<stylesheet>[0]<ruleset><selectors>;
# output:
# dropping term: gunk
# H1: selector    simple-selector qname   element-name    h1

Actions Options

  • :lax Pass back, don't drop, quantities with unknown dimensions.

Installation

You can use the Raku zef module installer to test and install CSS::Grammar:

% zef install CSS::Grammar

To try parsing some content:

% raku -MCSS::Grammar::CSS3 -e"say CSS::Grammar::CSS3.parse('H1 {color:blue}')"

See Also

References

This module been built from the W3C CSS Specifications. In particular:

css-grammar-raku's People

Contributors

dwarring avatar jraspass avatar moritz avatar szabgab avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar

css-grammar-raku's Issues

Install failed with P6opaque: no such attribute '$!storage'

$ panda install CSS::Grammar
==> Fetching CSS::Grammar
==> Building CSS::Grammar
==> Testing CSS::Grammar
t/parse-stylesheets.t .. ok
P6opaque: no such attribute '$!storage'
  in sub _display-string at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/Actions.pm:53
  in method warning at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/Actions.pm:64
  in method dropped-decl at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/Actions.pm:101
  in regex dropped-decl at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar.pm:141
  in regex any-declaration at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS21.pm:52
  in regex declaration at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS21.pm:50
  in regex declaration-list at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS21.pm:49
  in sub parse-tests at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/Test.pm:45
  in block <unit> at t/error-handling.t:24

t/error-handling.t ..... 
All 6 subtests passed 
t/css3-syntax.t ........ ok
P6opaque: no such attribute '$!storage'
  in method color:sym<hex> at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/Actions.pm:221
  in regex color:sym<hex> at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar.pm:97
  in regex color at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar.pm:92
  in regex term1:sym<color> at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar.pm:116
  in regex term1 at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar.pm:111
  in regex term at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar.pm:109
  in regex expr at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS1.pm:39
  in sub parse-tests at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/Test.pm:45
  in block  at t/compat.t:44
  in block <unit> at t/compat.t:19

t/compat.t ............. 
All 390 subtests passed 
    (less 3 skipped subtests: 387 okay)
t/regex-tokens.t ....... ok
P6opaque: no such attribute '$!storage'
  in sub _display-string at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/Actions.pm:53
  in method warning at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/Actions.pm:64
  in method any-declaration at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/Actions.pm:315
  in regex any-declaration at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS1.pm:36
  in regex declaration at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS1.pm:35
  in regex declaration-list at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS1.pm:34
  in regex declarations at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS1.pm:27
  in regex ruleset at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS1.pm:20
  in regex stylesheet at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS1.pm:13
  in regex TOP at /Users/gabor/work/.panda-work/1445708122_1/lib/CSS/Grammar/CSS1.pm:9
  in block <unit> at t/parse-warnings.t:24

t/parse-warnings.t ..... 
No subtests run 

Test Summary Report
-------------------
t/error-handling.t   (Wstat: 0 Tests: 6 Failed: 0)
  Parse errors: No plan found in TAP output
t/compat.t           (Wstat: 0 Tests: 390 Failed: 0)
  Parse errors: No plan found in TAP output
t/parse-warnings.t   (Wstat: 0 Tests: 0 Failed: 0)
  Parse errors: No plan found in TAP output
Files=6, Tests=656, 17 wallclock secs ( 0.25 usr  0.04 sys + 52.82 cusr  1.58 csys = 54.69 CPU)
Result: FAIL
test stage failed for CSS::Grammar: Tests failed
  in method install at /Users/gabor/work/rakudo/install/share/perl6/site/lib/Panda.pm:142
  in method resolve at /Users/gabor/work/rakudo/install/share/perl6/site/lib/Panda.pm:219
  in sub MAIN at /Users/gabor/work/rakudo/install/share/perl6/site/bin/panda:18
  in block <unit> at /Users/gabor/work/rakudo/install/share/perl6/site/bin/panda:145


Failure Summary
----------------
CSS::Grammar(
    *test stage failed for CSS::Grammar: Tests failed)

Upgrade to latest CSS 3 spec: CR-css-syntax-3-20140220/

See http://www.w3.org/TR/2014/CR-css-syntax-3-20140220/
This spec is likely to move to PR status by later this year. Some considerations:

  • implement tests for new sections: 4.1 Token Railroad diagrams, 4.3 Tokenizer Algorithms
  • also implements test for 5.1 Parser Railroad Diagrams and 5.4 Parser Algorithms
  • implement An+B microsyntax.
  • allow floating point numbers: 7.297eโˆ’3

CSS::Module::CSS3::Selectors is also impacted:

  • the nth-functor rules are moved to core css3 syntax
  • attribute selectors ^=, $= and *= are also moving to core syntax

Invalid codepoints behavior was updated

Hi! Thanks for your awesome module.

I am looking at its tests and since MoarVM/MoarVM@15e94ee an assumption in tests about parsing 0x123456 isn't hold true:

> 0x123456 > 0x10FFFF
True

which results in

===> Testing: CSS::Grammar:ver<0.3.4>:auth<github:p6-css>
[CSS::Grammar] t/compat.t ............. ok
[CSS::Grammar] # Failed test 'css3 escape no warnings'
[CSS::Grammar] # at /mnt/Blin/data/zef-data/store/CSS-Grammar-p6.git/8d3f7e2c0692b04c0cfb989acf0db5f26d20c384/lib/CSS/Grammar/Test.pm (CSS::Grammar::Test) line 76
[CSS::Grammar] # expected: ''
[CSS::Grammar] #      got: 'invalid unicode code-point: U+123456'
[CSS::Grammar] # You failed 1 test of 125
[CSS::Grammar] t/css3-syntax.t ........ 
[CSS::Grammar] Dubious, test returned 1 (wstat 256, 0x100)
[CSS::Grammar] Failed 1/125 subtests 
[CSS::Grammar] t/error-handling.t ..... ok
[CSS::Grammar] t/parse-stylesheets.t .. ok
[CSS::Grammar] t/parse-warnings.t ..... ok
[CSS::Grammar] t/regex-tokens.t ....... ok
[CSS::Grammar] Test Summary Report
[CSS::Grammar] -------------------

So it seems a broken codepoint now produces an error message instead of silencing it. Can tests be updated to avoid this assumption (preferably without breaking backward compatibility, of course) or to make something more clever to unblock installation?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.