Finding cause of lift.onEvent

Colin Bester

unread,

Nov 11, 2017, 8:44:35 AM11/11/17

to Lift

After upgrading liftweb, lift-ng, bootstrap and angular I found that angular's ngSwitch directive was no longer working. I was using <div ng-switch on="..."> and had to change to <div ng-switch="..."> which in itself is not an issue but I wanted to know why. My first path was down the angular route - see https://groups.google.com/d/msg/angular/_dwjGEUNNuI/hVyxio3rAQAJ for reference.

As I started digging in (refer to link for background) I found that it does appear that somehow lift (one of it's components, or me) is creating a on event which is causing on attribute to fail in ngSwitch.

If I add code:

<div on="testme">a</div>

and inspect dom I see a lift generate id, looking further in lift/page js file I see entry lift.onEvent("lift-event-js-F1221851018621TQ2PL1","",function(event) {testme;});

Changing html code to read:

<div onabc="testme">a</div>

shows lift.onEvent("lift-event-js-F1221851018832YOVYZQ","abc",function(event) {testme;}); in js file generated in lift/pages. Here you can clearly see stripped off 'on' and remaining 'abc'.

Changing attribute to 'myon' does not generate this onEvent entry in js file.

This ties very much with what I saw (refer to link).

How do I hunt this down? I have no directives in my code for 'on'.

I have further reduced my html file down to minimum, even dropping the snippet for now, same results



<!DOCTYPE html>
  <body class="lift:content_id=main">
  
    <div ng-app="myApp" id="main" data-lift="surround?with=default;at=content">
      <div id="controller" data-ng-controller="DeviceCtrl" >
        <!-- Prerequisite stuff the plugin needs -->
        <script data-lift="Angular" type="text/javascript"></script>
        <script id="angularscript" type="text/javascript"></script>
      <div data-lift="embed?what=_scripts">replaced with embedded content</div>       
        <div ng-cloak ng-hide="error === undefined || error.length === 0"
          class="error-list">
          <section>
            <h3>Exceptions:</h3>
            <ul>
              <li ng-repeat="err in error"><pre>{{err.trim()}}</pre></li>
            </ul>
          </section>
        </div>        
        <div ng-cloak ng-show="error === undefined || error.length === 0">
          <section ng-cloak class="banner">
            <p class="lead">
              <span class="lift:loc?locid=label.editing">Editing</span>: <span>{{currentUser.firstname}} {{currentUser.lastname}}</span>
            </p>
 </section>
 
 <div onab="testme">a
 </div>
        </div>
      </div>
    </div>
  </body>

Antonio Salazar Cardozo

unread,

Nov 12, 2017, 7:11:45 PM11/12/17

to Lift

Not 100% sure if this is what you're asking, but when LiftRules.extractInlineJavaScript is set

to true, Lift will strip all attributes starting with `on` and extract them into external event handlers.

The extraction/strip occurs in HtmlNormalizer, which then also converts these to JavaScript that

is finally returned as part of the page JavaScript. We should probably tweak this behavior to not

catch `on` by itself, but only catch it when it is strictly a prefix, i.e. there is something after it.

Thanks,

Antonio

Colin Bester

unread,

Nov 13, 2017, 11:30:34 AM11/13/17

to Lift

Antonio that is exactly it, I changed extractInlineJavaScript to false and the directive was not altered, setting to true acts as you describe and as I experienced.

I agree that it is most probably best to only catch 'on' by itself. This would not have helped in this particular situation with ng-switch though.

At least now I know what it is and can move on, thanks!

Antonio Salazar Cardozo

unread,

Nov 14, 2017, 5:23:07 PM11/14/17

to Lift

Glad to help!

Thanks,

Antonio

Joe Barnes

unread,

Nov 29, 2017, 2:51:58 PM11/29/17

to lif...@googlegroups.com

Ha! I literally experienced this exact issue last night. Had I only caught up on the Lift ML one day earlier!

Joe

/**

* Joe Barnes

* Owner/Principle Consultant, joescii, llc

* 256.541.0377

* j...@joescii.com

*/

--
--
Lift, the simply functional web framework: http://liftweb.net
Code: http://github.com/lift
Discussion: http://groups.google.com/group/liftweb
Stuck? Help us help you: https://www.assembla.com/wiki/show/liftweb/Posting_example_code

---
You received this message because you are subscribed to the Google Groups "Lift" group.
To unsubscribe from this group and stop receiving emails from it, send an email to liftweb+unsubscribe@googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Reply all

Reply to author

Forward