Coder Social home page Coder Social logo

microsoftedge / static-code-scan Goto Github PK

View Code? Open in Web Editor NEW
1.0K 118.0 227.0 1.4 MB

Run this quick static code scan on any URL to check for out-of-date libraries, layout issues and accessibility.

License: Other

JavaScript 97.01% HTML 2.48% CSS 0.50%

static-code-scan's Introduction

THIS PROJECT IS DEPRECATED

This project is deprecated and no longer maintained. Please check sonar if you need a similar tool but more flexible and modern.

Static Scan

This tool analyzes the HTML, CSS, and JavaScript of a site or application for common coding issues. It warns about practices such as incomplete specification of CSS properties, invalid or incorrect doctypes, and obsolete versions of popular JavaScript libraries.

It's easiest to use modern.IE by going to the modern.IE site and entering the URL to scan there. To customize the scan, or to use the scan to process files behind a firewall, you can clone and build the files from this repo and run the scan locally.

How it works

The modern.IE local scan runs on a system behind your firewall; that system must have access to the internal web site or application that is to be scanned. Once the files have been analyzed, the analysis results are sent back to the modern.IE site to generate a complete formatted report that includes advice on remediating any issues. The report generation code and formatted pages from the modern.IE site are not included in this repo.

Since the local scan generates JSON output, you can alternatively use it as a standalone scanner or incorporate it into a project's build process by processing the JSON with a local script.

The main service for the scan is in the app.js file; it acts as an HTTP server. It loads the contents of the web page and calls the individual tests, located in /lib/checks/. Once all the checks have completed, it responds with a JSON object representing the results.

Installation and configuration

  • Install node.js. You can use a pre-compiled Windows executable if desired. Version 0.10 or higher is required.
  • If you want to modify the code and submit revisions, Install git. You can choose GitHub for Windows instead if you prefer. Then clone this repository. If you just want to run locally then downloading then you just need to download the latest version from here and unzip it
  • Install dependencies. From the Modern.ie subdirectory, type: npm install
  • If desired, set an environment variable PORT to define the port the service will listen on. By default the port number is 1337. The Windows command to set the port to 8181 would be: set PORT=8181

CLI

The scanner has a CLI interface that prints directly the results for a website. You just have to run the following command to use it:

static-code-scan

demo

Note: Windows users may need to navigate to the Modern.ie subdirectory and type npm link to get the static-code-scan command to work.

Via browser

  • Start the scan service: From the Modern.ie subdirectory, type: node app.js and the service should respond with a status message containing the port number it is using.
  • Run a browser and go to the service's URL; assuming you are using the default port and are on the same computer, the URL would be: http://localhost:1337/
  • Follow the instructions on the page.

Testing

The project contains a set of unit tests in the /test/ directory. To run the unit tests, type grunt nodeunit.

JSON output

Once the scan completes, it produces a set of scan results in JSON format:

{
    "testName" : {
        "testName": "Short description of the test",
        "passed" : true/false,
        "data": { /* optional data describing the results found */ }
    }
}

The data property will vary depending on the test, but will generally provide further detail about any issues found.

Code of Conduct

This project has adopted the Microsoft Open Source Code of Conduct. For more information see the Code of Conduct FAQ or contact [email protected] with any additional questions or comments.

static-code-scan's People

Contributors

adrianba avatar brenopolanski avatar dmethvin avatar jdalton avatar jimihford avatar jrsconfitto avatar m-gagne avatar marknoble avatar molant avatar naokikimura avatar nsbingham avatar punkchameleon avatar sarvaje avatar scribcloud avatar timothya avatar yuichinukiyama avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

static-code-scan's Issues

Offline scan is trying to access online resources

I've been trying to setup an offline code scanner to can internal web resources. However whenever I try to scan an internal URL the application crashes with the following dump in the console:

C:\Users\Public\browser\modern.IE-static-code-scan-master>node app.js
Server started on port 1337
To scan a private url go to http://localhost:1337/ and follow the instructions

C:\Users\Public\browser\modern.IE-static-code-scan-master\node_modules\promised-
io\promise.js:242
throw error;
^
Error: connect ETIMEDOUT
at errnoException (net.js:901:11)
at Object.afterConnect as oncomplete

Looking at Wireshark I can see my machine trying to access the following online resources:

api.kraken.io
iecvlist.microsoft.com

Which it cannot.

If I connect the machine to the Internet and scan a publicly accessibly URL the scanner works, but when I am connected to the corporate network (to access internal URLs, and where I have no Internet access) the scanner crashes.

I might be able to get access to the resources through the corporate proxy, but how would I configure the scanner to use a proxy with a username and password?

Thanks, Tim.

Make instructions clearer

Users can download the code directly as zip and use that version for their local tests. Instructions should be updated to make the installation process faster and smoother

Lingering URL-encoded characters in report output

From an email:

I noticed when I clicked the "View full list of missing CSS properties we detected “ link the return parsed css from the site I had scanned had the hex code instead of “=“ in the css selector.

Example: input[type%3D"search"] appearance 217

Possible bad advise on DOCTYPE

I just ran a scan on modern.ie and got the advise, to use a DOCTYPE with a link to a blog post about update your Docmode.

"Using a DocType that recognizes modern web standards can increase site performance in Internet Explorer by an average of 30%."

Since I was testing a SVG site, I believe all of the above suggestions to be wrong. According to Jonathan Watt DocType should be avoided on SVG sites.

Now, I don't know the internals of IE and I would feel very bad, getting a 30% performance hit. I'm also not sure if IE cares for the <?xml version="1.0" encoding="UTF-8"?> XML declaration. And if IE only want the DocType (Jonathan Watt's advised is wrong in regard to IE), do I set the encoding attribute directly on the SVG tag?

I hope someone closer to the source can enlighten me and improve the recommendations of modern.IE-static-code-scan.

Link to the site I scanned: http://www.demægtigevikinger.dk/prototype/v0.3/

Url input needs improved validation

The following Url format shouldn't be appended with http::

//github.com

Currently implementation makes it:

http:////github.com

It should remain //github.com without http. The browser will fetch the resource without any issue.

Accessiblity: Find missing ALT tags on images

This is a small subset of #22, we could either just do this one or figure out how to do that one but filter irrelevant results? The W3C Validator tends to be strict to the point of its results not helping diagnose problems.

Accessiblity: Detect use of hover-related actions

Could be a bit tricky to do this without excessive noise. We can definitely look for :hover CSS rules (although probably blocked by #7 ) but simple rules like color changes don't affect usability on touch designs. Things like hovering menus do but those often involve JavaScript so they would be harder to detect.

CSS prefix check is overly prefix-happy

When encountering a prefix like transition the scan recommends -webkit-, -moz-, and -o- be added even though only Webkit ever implemented the prefixed version according to http://caniuse.com/#search=transition .

The report should only recommend adding prefixes that are still needed by deployed browsers, the caniuse.com site is probably the best source of info for that.

Lib version check not correct

I checked a website containing jquery 1.9.1

The scanner suggested the next compatible version to be 1.9.2 and the latest version of jquery to be 1.9.0 (instead of the expected 1.11.x)

Check for gzip content

New check to let the user now if the content is gzipped or not and the benefits of doing it

Improve touch test

Try to find an heuristic to see if there are hover menus or not. Maybe we can look for the most popular menu libraries.
We should also suggest the usage of aria-haspopup or any other accessibility attributes

Replace CSS parser

The current CSS parser crashes if the CSS is malformed or using some "non-traditional" rules. It will be cool to use CSSLint and create new rules for it.

NTLM support

Investigate NTLM support for enterprise scenarios

ECONNREFUSED error with all sites

I can't get Modern IE static code scan to work locally and hope I can get your help.

I downloaded and installed

  • node-v0.10.22-x64
  • python 2.7.6

I downloaded Modern IE static code scan from the master branch on November 26th 2013,
copied it on my c drive (C:\npm\modern.IE-static-code-scan-master)
and installed it with success using the command npm install

I launched the code scan url http://localhost:1337/
and entered a localhost url to scan (http://localhost/vlaine).
This site is using anonymous authentication so I left username and password blank.

It crashed with the following error (using IE10, Chrome 24.0.1312.14 and Firefox 24.0)

throw error;
^
Error: connect ECONNREFUSED
at errnoException (net.js:901:11)
at Object.afterConnect as oncomplete

Can you please help me ?

Screenshots:
http://s23.postimg.org/spk50o91n/image.png
http://s23.postimg.org/mal4402bv/image.png

Scanner fails to acknowledge the case when the `/browserconfig.xml` file is provided

General information

By default, starting with IE11 on Windows 8.1, IE will request the /browserconfig.xml file when a user clicks/touches the pin site / add to favorites button. If the /browserconfig.xml file is available, IE will use the tile images specified in it.

From http://msdn.microsoft.com/en-us/library/ie/dn455106.aspx:

When a user first pins your site, it's displayed as a static tile on the Start screen. By default, the image on the tile is your website's favicon or a default IE11 logo. You can customize the image by adding metadata tags to your webpage's markup or adding a browser config file.
...
You can save this XML file as browserconfig.xml and save it at the root of your server. IE11 automatically reads the file when the user pins the site.

See also: h5bp/html5-boilerplate#1481.

Issue

The scanner fails to acknowledge the case described above, and informs the user that: "We've found that this webpage hasn't built a Windows 8.1 Start Screen tile..."

Test page

Whitelist certain files for specific features

Some third party scripts like analytics do browser sniffing, but only for the purpose of sending the browser name/type back for analysis. Since those kind of uses aren't evil and the includer of the file has no control over it anyway, it could be useful to exclude the file from the report via a URL match of some kind (domain or file name). Examples include Google Analytics as well as the ones listed below.

Via this email feedback:

Mon 10/7/2013 10:28 AM
To:
IE Dev Relations;

Hi... just some feedback on your lovely tool. :)

The test for Browser detection should exclude analytics programs (like
MixPanel and Kissmetrics). Those are measuring things — but are not
affecting the page. We serve the same thing to everyone. (But your tool
says I'm browser sniffing.)

HTML5 inputs

A user experience can be improved a lot when using the HTML5 input types such as email or numbers. We should check for those

IE Conditional Comments

Look for conditional comments that target all version of IE indiscriminately or IE9 versions if using gt or gte and flag it as an issue

Better control over report

As discussed in #29, it would be good to have a way to control what tips were given for particular scans. It could be perhaps controlled by URL options and/or checkboxes in the UI.

Avoid some tips for single-page apps

Reported by @docluv

For a single page app, tips like flip ahead or prerender don't really apply. Not sure if we have a reliable way to detect that it's an SPA though.

From: chris love
Sent: Tuesday, November 19, 2013 5:55 PM
To: IE Dev Relations
Subject: Feedback on modern.IE

Running my blog, which is a SPA through the URL scanner and I get dinged for prerender, prefetch & flip ahead browsing. How can I trigger this if my SPA consumes JSON and merges the data with HTML templates before injecting the full markup in the DOM? It is not a new page, it is a new view using a #!.

http://www.modern.ie/en-us/report#http%3A%2F%2Flove2dev.com

modern.ie should be able to run on Azure websites

Not possible at the moment cause Azure doesn't support node 0.10.x. Also when deploying the git repository to Azure, the deployment fails with "Missing server.js/app.js files, web.config is not generated". The code is located in lib/service.js, but Azure can't find even though it is referenced in package.json.

Not detecting box-shadow prefixed

If a rule specifies a prefixed box-shadow property it should also provide the unprefixed form in the rule.

Reported by Daniel Thornton from a scan of http://bsonspec.org .

I suspect we need a more thorough review of properties, for example box-sizing which still requires -moz-box-sizing in Firefox 24 but is otherwise unprefixed all the way back to IE8.

SEMANTIC html

Is my biggest concern nowadays. With frameworks and lots of people coming from flash background, you see lots of great sites, with amazing design and css/js, but the semantic is terrible! Would be great if this tool had a way to check that.
Many years ago (2001-2006) I did some works where accessibility was required by law, and lucky me it was where i learn the importance of the semantic meaning in HTML. If most of the developers could ear what a site sounds like in a screan reader, that would open their mind to the importance of the semantic. So maybe we can't do that, but we can "show" them how theirs website looks like.
So I got the idea to make a tool like: http://wave.webaim.org/
I would not use pictures but would just lay down the content with some icons or bold text showing that is a H, p, a, article etc.
If we could "show" that is so different to have:

http://take.ms/aE9hT

The non semantic way would be presented, as a screen reader would read (at least the old one, now i don' t know anymore eheh): no poses, no line breaks:
<"link">NAME OF THE SITE <"/link"> We are a company bla bla blabla that does:computer software

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.