CGI/Perl Guide | Learning Center | Forums | Advertise | Login
Site Search: in

  Main Index MAIN
INDEX
Search Posts SEARCH
POSTS
Who's Online WHO'S
ONLINE
Log in LOG
IN

Home: Perl Programming Help: Beginner: Re: [mohan] Script to find unused CSS styles: Edit Log



Zhris
Enthusiast

Jul 30, 2016, 7:03 PM


Views: 14176
Re: [mohan] Script to find unused CSS styles

Hi,

I helped you write that code in this thread. In this case you want to add a specific test that tests if a css property is used. You could certainly figure out a way to implement this test in that code, but thats a separate problem.

I suggest you use a set of established modules to take care of parsing the css, converting selectors to xpaths, then testing if a property exists. I have had a play around and came up with the following standalone demo designed to process a single set of html and corresponding css:


Code
use strict; 
use warnings;
use CSS;
use HTML::Selector::XPath 'selector_to_xpath';
use HTML::TreeBuilder::XPath;
use Data::Dumper;

my $properties = [ 'margin' ];

my ( $chunk_html, $chunk_css ) = chunks( );
my $tree = HTML::TreeBuilder::XPath->new_from_content( $chunk_html );
my $css = CSS->new( ); $css->read_string( $chunk_css );

my $ref = [ ];

for my $style ( @{$css->{styles}} )
{
for my $property ( grep { $style->get_property_by_name( $_ ) } @$properties )
{
for my $selector ( map { $_->{name} } @{$style->{selectors}} )
{
my $xpath = selector_to_xpath( $selector );
my $exists = $tree->exists( $xpath );

# $ref->{$selector} = $exists;
push @$ref,
{
property => $property,
selector => $selector,
xpath => $xpath,
exists => $exists,
};
}
}
}

print Dumper $ref;

sub chunks
{
local $/ = '__DATA__';

my $chunks = [ ];

while ( my $chunk = <DATA> )
{
chomp $chunk;

#open my $handle, '<', \$chunk;

push @$chunks, $chunk;
}

return @$chunks;
}

__DATA__

<html>
<head>
<title></title>
</head>
<body>
<div class="three"></div>
</body>
</html>

__DATA__

.one
{
margin: 0px;
}

.two
{
padding: 0px;
}

.three, .four
{
margin: 0px;
}


Output:


Code
$VAR1 = [ 
{
'exists' => 0,
'xpath' => '//*[contains(concat(\' \', normalize-space(@class), \' \'), \' one \')]',
'property' => 'margin',
'selector' => '.one'
},
{
'selector' => '.three',
'exists' => 1,
'xpath' => '//*[contains(concat(\' \', normalize-space(@class), \' \'), \' three \')]',
'property' => 'margin'
},
{
'selector' => '.four',
'xpath' => '//*[contains(concat(\' \', normalize-space(@class), \' \'), \' four \')]',
'exists' => 0,
'property' => 'margin'
}
];


If this is something you can work from, have a play around and let us know if you have any issues.

Chris


(This post was edited by Zhris on Jul 30, 2016, 9:36 PM)


Edit Log:
Post edited by Zhris (Enthusiast) on Jul 30, 2016, 7:13 PM
Post edited by Zhris (Enthusiast) on Jul 30, 2016, 7:16 PM
Post edited by Zhris (Enthusiast) on Jul 30, 2016, 9:36 PM


Search for (options) Powered by Gossamer Forum v.1.2.0

Web Applications & Managed Hosting Powered by Gossamer Threads
Visit our Mailing List Archives