Bug 217671

Summary: Non-obvious behavior when inspecting remote CSS
Product: web Reporter: Petr Jiricka <pjiricka>
Component: InspectionAssignee: Jan Stola <jstola>
Status: RESOLVED FIXED    
Severity: normal CC: vriha
Priority: P3 Keywords: USABILITY
Version: 7.3   
Hardware: All   
OS: All   
Issue Type: ENHANCEMENT Exception Reporter:
Attachments: Project that reproduces the problem

Description Petr Jiricka 2012-08-31 09:09:27 UTC
Created attachment 123773 [details]
Project that reproduces the problem

1. Unzip and open the attached projects (Java webapp and HTML5 app)
2. Run the Java project on GlassFish
3. Run the HTML5 application - table with results obtained from web service will be displayed
4. Turn on select mode in browser and select some cell in the table

=> CSS Styles window is populated, but the Rule Editor continues to say <No Properties>

At the end this is understandable, because the CSS we are inspecting is a remote file (btw there is a related bug 217664), but this should be signaled to the user in a better way. Currently it is not apparent why the rule editor does not display any properties.

One possible way to fix it would be to display a read-only view of the properties, but there would still need to be some indication explaining the user why they are read-only.
Comment 1 Marek Fukala 2012-09-03 11:46:25 UTC
Assuming we have the "css live update" I believe the RE can still "work" w/o saving the changes - just modifying the DOM.

OTOH this doesn't make much sense if the file is truly "remote" and has no local counterpart.
Comment 2 Marek Fukala 2012-11-29 08:54:27 UTC
I can't reproduce it as the styles view remains empty for the newhtml.html regardless what I try to select/inspect.
Comment 3 Jan Stola 2012-11-29 10:34:16 UTC
(In reply to comment #2)
> I can't reproduce it as the styles view remains empty for the newhtml.html
> regardless what I try to select/inspect.

The problem is that the attached newHtml/html file is using
  http://mottie.github.com/tablesorter/css/blue/style.css
stylesheet that is no longer available. It seems that the current location of the stylesheet is
  http://mottie.github.com/tablesorter/css/theme.blue.css
Moreover, it seems that the original stylesheet was based on 'tablesorter' class while the new one is based on 'tablesorter-blue' class. Hence, you have to update the class of the <table> element for the style to be applied.

> One possible way to fix it would be to display
> a read-only view of the properties

The page inspection has access to the text of the stylesheet no matter where it comes from. Hence, it would be possible to save a local read-only copy of the remote stylesheet and let the CSS infrastructure (including the Rule Editor) work with this file.
Comment 4 Jan Stola 2013-02-07 12:41:24 UTC
Implemented:
* remote stylesheets are downloaded and represented
  by read-only FileObjects by now
* Rule Editor is no longer empty for rules from remote stylesheets
* Go To Source actions for Properties and Rules from remote stylesheets
  open a read-only copy of a downloaded stylesheet
* links in Applied Styles section of CSS Styles view open a read-only copy
  of a downloaded stylesheet (for remote stylesheets)

Modified files:
http://hg.netbeans.org/web-main/rev/af1e87137566
http://hg.netbeans.org/web-main/rev/e18b01e6ce1b
http://hg.netbeans.org/web-main/rev/1058447af7d7