Managed Script plugin and SCM sync on Jenkins

If you are using https://wiki.jenkins-ci.org/display/JENKINS/Managed+Script+Plugin  and the https://wiki.jenkins-ci.org/display/JENKINS/SCM+Sync+configuration+plugin

You will have to add a Manual synchronization includes: 

buildstep-config-files.xml

to get it to save the managed files configuration.  Otherwise all your managed script files you share across jobs will be lost if you lose the jenkins server and have to rebuild it.

 

IE8 Angularjs

I had a problem with IE8 compatibility mode going to document Mode: IE 7 standards. This caused my javascript to act funny and radio buttons not to work.
I was also getting the error pop up too:

https://docs.angularjs.org/api/ng/service/$sce

I found the following on stack overflow that is the key as my project is using Html5.
I have the in my project

http://stackoverflow.com/a/7685060/708860

Excerpt of what I did that worked.

Note the the [if] tag before the <!doctype html>

<!--[if HTML5]><![endif]-->
<!doctype html>
<!--[if the boilerplate conditionals goes here<![endif]-->
<head>
<!--[if !HTML5]>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<![endif]-->

Spring security and Cors with angularjs

I used this as the basis of what I was doing with cors and angularjs.

Cors and Angularjs

I ran into the problem that I was also using Spring Security.

In my web.xml originally my cors filter was included after the spring security filter.

This stopped my filter from being called and returning the correct headers.

 

I corrected it by moving the cors filter above the security filter like below.

 

<filter>
        <filter-name>corsFilter</filter-name>
        <filter-class>com.myproject.config.CorsFilter</filter-class>
    </filter>

<filter>
        <filter-name>springSecurityFilterChain</filter-name>
        <filter-class>org.springframework.web.filter.DelegatingFilterProxy</filter-class>
    </filter>

    <filter-mapping>
        <filter-name>corsFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

    <filter-mapping>
        <filter-name>springSecurityFilterChain</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

Stubbing out angularjs backends for testing via fixtures simplified.

Original Blog post this comes from.

http://michalostruszka.pl/blog/2013/05/27/easy-stubbing-out-http-in-angularjs-for-backend-less-frontend-development/

 Previous Usage

I have been using the other solution that the article describes to create a fixtures service for testing purposes but that would mean including a grunt string substitution module to ensure I did not include it in the production app.

What I liked about the new style of doing things

Using the way from the blog you can stop changing your ng-app in your index.html file and just use ?nobackend on your urls to hit the fixtures service.

My Changes to make it more useful.

Changes to index.html to ensure it is not included in production

I have made a change to my index.html file to ensure it is not packaged when you run grunt build to get the minimised files.

The below tells the build task to exclude these files.

You have to add your angular-mocks to the app else it will not be able to hook into the $httpbackend for stubbing.

<!-- build:remove -->
  <!-- Local stubbing service for development -->
  <script src="bower_components/angular-mocks/angular-mocks.js"></script>
  <script src="scripts/mock/httpBackendStub.js"></script>
<!-- endbuild --></p><p>

Modification to the solution to continue to serve html files from angular app

Here is the modification to the httpBackendStub.js to allow the angular app to still route to the html files without having to run a separate server as the blog describes.

 ......

.run(function($httpBackend) {
  $httpBackend.whenGET(/^views\//).passThrough();
  $httpBackend.whenGET( 

.......

Protractor test changes.

Make sure to update your protractor tests to use the new ?nobackend url and fix any test assertions.

Protractor Issues

This may cause problems with any relative url links.  I have not investigated enough to find a good solution for this.

Grunt Proxy setup for Yeoman 1.2

Purpose

I was wanting to keep my front end project separate from my backend.  This meant that the back end was on a different port than the yeoman server.  This causes cross site scripting issues with the yeoman server.  I figured out the only way around this was via a proxy.

I found this article from Mike Partridge from Jan 2014 which was a good starting point but the yeoman build has changed so this is no longer working.

http://www.hierax.org/2014/01/grunt-proxy-setup-for-yeoman.html

Tools used

  • grunt-cli v0.1.13

  • grunt v0.4.5

  • yeoman 1.2.0

  • grunt-connect-proxy 0.1.10

  • angular-generator 0.9.1

Change to instructions

The only change to the directions in the post from hierax is the following.   I just changed the things that are pushed into middleware.  Live reload no longer has a base [ ] block.

Step 3 should now look like:

livereload: {
 options: {
 open: true,
 middleware: function (connect) {
   // Setup the proxy
   var middlewares = [require('grunt-connect-proxy/lib/utils').proxyRequest];

   middlewares.push(connect.static('.tmp'));

   middlewares.push(connect().use(
     '/bower_components',
     connect.static('./bower_components')
   ));
   middlewares.push(connect.static(appConfig.app));

   return middlewares;
 }
 }
 },
Link

Linux File system explained

I have struggled with why certain files are located where they are in Linux.  Finally found a link to explain why.  There will be some differences between distros but this seems to be a great reference.