<div dir="ltr"><div><span style="color:rgb(51,51,51);font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px">"jquery is a banned API"</span></div><div><span style="color:rgb(51,51,51);font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px"><br></span></div><div><span style="color:rgb(51,51,51);font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px">That is an interesting statement. Angular comes with a built-in, home grown implementation of jQuery called jqlite, which automatically falls back on full jQuery if it is present. From <a href="https://docs.angularjs.org/api/ng/function/angular.element">their docs</a>:</span></div><span style="color:rgb(51,51,51);font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px"><div><span style="color:rgb(51,51,51);font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px"><br></span></div><i>"all element references in Angular are always wrapped with jQuery or jqLite; they are never raw DOM references"</i></span><div><div><span style="color:rgb(51,51,51);font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px"><i><br></i></span></div><div><font color="#333333" face="Helvetica Neue, Helvetica, Arial, sans-serif"><span style="font-size:14px;line-height:20px">The Angular way is to encapsulate all your DOM manipulation using jQuery/jqlite inside directives. When you are writing a custom directive, the target DOM element is passed in as a jQuery/jqlite element, so you can't really avoid it.</span></font></div><div><font color="#333333" face="Helvetica Neue, Helvetica, Arial, sans-serif"><span style="font-size:14px;line-height:20px"><br></span></font></div><div><font color="#333333" face="Helvetica Neue, Helvetica, Arial, sans-serif"><span style="font-size:14px;line-height:20px">Mike</span></font></div><div><span style="color:rgb(51,51,51);font-family:'Helvetica Neue',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px"><i><br></i></span></div></div></div><div class="gmail_extra"><br><div class="gmail_quote">On 29 June 2015 at 08:22, Dinis Cruz <span dir="ltr"><<a href="mailto:dinis.cruz@owasp.org" target="_blank">dinis.cruz@owasp.org</a>></span> wrote:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex"><div dir="ltr">Thanks all for the great feedback, which matches the research I had done on it (see <a href="http://blog.diniscruz.com/2015/06/why-we-are-going-to-use-angularjs-13-on.html" target="_blank">http://blog.diniscruz.com/2015/06/why-we-are-going-to-use-angularjs-13-on.html</a> for the list of reasons we are going to go with Angular).<div><br></div><div>Joanna, regarding jQuery, my experience (in both developing and reviewing jQuery apps) is that it tends to promote an 'lets just hack it to make it work' kind of development workflow. In jQuert code, there are always tons of DOM manipulations, which will always include (browser specific and other) hacks, and create code with quite a lot of dependencies and lack-of-isolation between components. Basically you shown me an large jQuery app (like the one we developed) and It most likely be an app hard to refactor, hard to maintain and hard to understand what really is going on (ironically the power of jQuery tends to create this stuff, since it is always possible to 'fix something' by adding a bit of jQuery somewhere).</div><div><br></div><div>And of course jQuery is also a nightmare from a security point of view, since as mentioned on this thread there are quite a lot of sinks that will transform strings into code.</div><div><br></div><div>In order to make our app secure and easy to code we are using the following stack/technologies:</div><div><br></div><div>- no jQuery (as far as I am concert it is a banned API :)  )</div><div>- Jade for creating html (i.e. no raw html and encoding by default on all variables)</div><div>- 95%+ Unit Test coverage</div><div>- NodeJs on the server (with one a version of the website created with NO Javascript)</div><div>- AngularJS on the client, with full use of Angular components to keep code clean, easy to test and isolated (Controllers, Directives, Services, etc...)</div><div>- CoffeeScript on both server and client (to promote good Javascript practices, keep code clean and easy to test)</div><div>- Git Flow, with git submodules used to separate the code into different areas of responsibility</div><div>- Docker for deployment and testing (with ability to start new instances of the site in seconds (on any branch))</div><div>- Slack for team collaboration</div><div>- GitHub for Issues (and of course code hosting :)  )</div><div><br></div><div>I also have to say that I like the maturity and amount of thinking that has gone into AngularJS security. Yes there is a level of moving parts, but they push the development teams to have a really good architecture (which is key to enable all team members to write secure code).</div><div><br></div><div>In fact, what I really like about our current development environment/workflow (the one based on Node, CoffeeScript and Jade) is that there are large parts of the code base that at the moment it is REALLY hard to create a security vulnerability. For example, since we use Jade for the views, I don't have to 'security review' design and UI changes since they are secure by default (and I have a test to check for the on case where un-escape content can be enabled). Compare this to the normal JSP or jQuery world where any code change is one small mistake away from creating a security issue. Basically the best way to prevent HTML injections (aka XSS) is to not have any HTML coding at all :)</div><span class="HOEnZb"><font color="#888888"><div><br></div><div>Dinis</div></font></span></div><div class="HOEnZb"><div class="h5"><div class="gmail_extra"><br><div class="gmail_quote">On 29 June 2015 at 00:21, Kim Carter <span dir="ltr"><<a href="mailto:kim.carter@owasp.org" target="_blank">kim.carter@owasp.org</a>></span> wrote:<br><blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
  
    
  
  <div bgcolor="#FFFFFF" text="#000000">
    With Angular: Generally a lot of work for a large non-trivial
    application. Angular is pretty much an all or nothing framework.<br>
    <br>
    With React and Flux: As much or as little work as you want it to be.
    Many teams use React to replace small pieces at a time. The last
    client I used React with I used it to replace the backbone views.
    Why only the views? Because there was nothing wrong with the router
    or models and the problem with the existing code base was the manual
    DOM manipulation and events being in unknown states due to having
    many teams work on the code base and all of which did things a
    different way. By using React to replace a Backbone view at a time,
    the work load was very manageable. I attacked the worst views first,
    unravelled them and replaced them with React components. React is
    essentially a view engine, but can be used for everything. With
    React, you can use as little or as much as you like.<span><br>
    <br>
    <br>
    <div><img src="cid:part1.01000409.02020309@owasp.org" style="margin:0 20px 20px 0;display:inline;float:left">
      <p style="display:block;margin:0px;color:#4a5da1;font-size:16px;font-weight:800;margin:0 0 5px 0">Kim Carter</p>
      <p style="display:block;color:#4a5da1;font-size:12px;margin:0 0 5px 0">OWASP New Zealand Chapter Leader (Christchurch)</p>
      <p style="display:block;color:#4a5da1;margin:0 0 5px 0"> <abbr title="cellular phone" style="font-weight:800">c:</abbr> <span>
          <a href="tel:%2B64%20274%20622%20607" value="+64274622607" target="_blank">+64 274 622 607</a><br>
        </span></p>
      <p style="display:block;color:#4a5da1;margin:0 0 5px 0"><span><br>
        </span> </p>
    </div>
    </span><div><div><div>On 29/06/15 08:35, Jim Manico wrote:<br>
    </div>
    <blockquote type="cite">
      
      <div>JQuery was originally built to help with cross-browser quirks
        which is becoming less of an issue. I see plenty of folks
        migrating away from it to Angular and similar. There are a
        variety of migration resources on the net and it's doable - but
        migration can be time consuming work.<br>
        <br>
        <div>--</div>
        <div>Jim Manico</div>
        <div>
          <div>
            <div style="word-wrap:break-word">
              <div><span style="background-color:rgba(255,255,255,0)">Global Board Member</span></div>
              <span style="background-color:rgba(255,255,255,0)">OWASP
                Foundation</span>
              <div><a href="https://www.owasp.org/" style="background-color:rgba(255,255,255,0)" target="_blank"><font color="#000000">https://www.owasp.org</font></a></div>
            </div>
          </div>
          <div><span style="background-color:rgba(255,255,255,0)">Join me at <a href="http://appsecusa.org/" target="_blank">AppSecUSA</a> 2015!</span></div>
        </div>
      </div>
      <div><br>
        On Jun 28, 2015, at 10:22 AM, johanna curiel curiel <<a href="mailto:johanna.curiel@owasp.org" target="_blank">johanna.curiel@owasp.org</a>>
        wrote:<br>
        <br>
      </div>
      <blockquote type="cite">
        <div>
          <div dir="ltr">From a developer point of view, if I had to
            replace Jquery with Angular or React how much work is that?
            <div><br>
            </div>
            <div>Imagine my entire front is completely dependent on
              Jquery...any instructions or ideas how to achieve this
              without an excruciating QA?</div>
          </div>
          <div class="gmail_extra"><br>
            <div class="gmail_quote">On Sun, Jun 28, 2015 at 4:09 PM,
              Jim Manico <span dir="ltr"><<a href="mailto:jim.manico@owasp.org" target="_blank">jim.manico@owasp.org</a>></span>
              wrote:<br>
              <blockquote class="gmail_quote" style="margin:0 0 0 .8ex;border-left:1px #ccc solid;padding-left:1ex">
                <div dir="auto">
                  <div>Angular is much better for XSS defense today, but
                    React was built with a much more sound core and is
                    likely to have a better future.</div>
                  <div><br>
                  </div>
                  <div>#nuance<br>
                    <br>
                    <div>--</div>
                    <div>Jim Manico</div>
                    <div>
                      <div>
                        <div style="word-wrap:break-word">
                          <div><span style="background-color:rgba(255,255,255,0)">Global
                              Board Member</span></div>
                          <span style="background-color:rgba(255,255,255,0)">OWASP
                            Foundation</span>
                          <div><a href="https://www.owasp.org/" style="background-color:rgba(255,255,255,0)" target="_blank"><font color="#000000">https://www.owasp.org</font></a></div>
                        </div>
                      </div>
                      <div><span style="background-color:rgba(255,255,255,0)">Join
                          me at <a href="http://appsecusa.org/" target="_blank">AppSecUSA</a> 2015!</span></div>
                    </div>
                  </div>
                  <div>
                    <div>
                      <div><br>
                        On Jun 28, 2015, at 4:21 AM, Dinis Cruz <<a href="mailto:dinis.cruz@owasp.org" target="_blank">dinis.cruz@owasp.org</a>>
                        wrote:<br>
                        <br>
                      </div>
                      <blockquote type="cite">
                        <div>
                          <p dir="ltr">Which one makes it easier to
                            write secure code, has more features to help
                            security and has better support for
                            Security-focused tests?</p>
                          <p dir="ltr">What do you see on the ground? </p>
                          <p dir="ltr">Which one tends to create apps
                            with more vulnerabilities?</p>
                        </div>
                      </blockquote>
                    </div>
                  </div>
                  <blockquote type="cite">
                    <div><span>_______________________________________________</span><br>
                      <span>OWASP-Leaders mailing list</span><br>
                      <span><a href="mailto:OWASP-Leaders@lists.owasp.org" target="_blank">OWASP-Leaders@lists.owasp.org</a></span><br>
                      <span><a href="https://lists.owasp.org/mailman/listinfo/owasp-leaders" target="_blank">https://lists.owasp.org/mailman/listinfo/owasp-leaders</a></span><br>
                    </div>
                  </blockquote>
                </div>
                <br>
                _______________________________________________<br>
                OWASP-Leaders mailing list<br>
                <a href="mailto:OWASP-Leaders@lists.owasp.org" target="_blank">OWASP-Leaders@lists.owasp.org</a><br>
                <a href="https://lists.owasp.org/mailman/listinfo/owasp-leaders" rel="noreferrer" target="_blank">https://lists.owasp.org/mailman/listinfo/owasp-leaders</a><br>
                <br>
              </blockquote>
            </div>
            <br>
          </div>
        </div>
      </blockquote>
      <br>
      <fieldset></fieldset>
      <br>
      <pre>_______________________________________________
OWASP-Leaders mailing list
<a href="mailto:OWASP-Leaders@lists.owasp.org" target="_blank">OWASP-Leaders@lists.owasp.org</a>
<a href="https://lists.owasp.org/mailman/listinfo/owasp-leaders" target="_blank">https://lists.owasp.org/mailman/listinfo/owasp-leaders</a>
</pre>
    </blockquote>
    <br>
  </div></div></div>

<br>_______________________________________________<br>
OWASP-Leaders mailing list<br>
<a href="mailto:OWASP-Leaders@lists.owasp.org" target="_blank">OWASP-Leaders@lists.owasp.org</a><br>
<a href="https://lists.owasp.org/mailman/listinfo/owasp-leaders" rel="noreferrer" target="_blank">https://lists.owasp.org/mailman/listinfo/owasp-leaders</a><br>
<br></blockquote></div><br></div>
</div></div><br>_______________________________________________<br>
OWASP-Leaders mailing list<br>
<a href="mailto:OWASP-Leaders@lists.owasp.org">OWASP-Leaders@lists.owasp.org</a><br>
<a href="https://lists.owasp.org/mailman/listinfo/owasp-leaders" rel="noreferrer" target="_blank">https://lists.owasp.org/mailman/listinfo/owasp-leaders</a><br>
<br></blockquote></div><br></div>