[Kss-devel] problem with effects in Opera and IE

[Denis Mishunov]

Hello Balazs.

Thanks for your response on this.

>> But, then I wrap it with KSS and here the problem appears. I load the
>> page and click the link to which the action is assigned. Action  
>> works in
>> FF and Safari only. Both Opera and IE create the DIV #overlay, but
>> nothing more. They just raise JS error. If I wrap both effects with
>> comments, so that they are not available for engine, no errors in any
>> browser.
>>
>> Here is the error that Opera shows in it's log:
>> http://paste.plone.org/16259
>>
>> IE suggests to run debugger, I run it and it shows the stopper in...
>>
>> While I was testing this behavior, i has been changed somehow. Now I
>> don't get any errors in console. The effect is just not applied in  
>> Opera
>> and IE. IE shows that small triangle in the bottom left corner saying
>> that page was displayed with the errors only. This triangle  
>> appears only
>> after action is called. When the page loads and action is not  
>> invoked,
>> there is no triangle.
>
> Let's summarize how I understand it:
>
> - your kss action, in FF, works

right. It works in FF and Safari.

> - your kss action, in Opera and IE, fails (first you got javascript
> error, with the pasted code you get no error but nothing happens)

right.

> - your version of javascript code that does not interface with kss  
> works

right

> - your kss action even works in Opera, when kss is put into Production
> mode (while same thing failed to work in Development mode)

not right actually. kss works in Opera when portal_javascript is in  
debug mode (Development mode for KSS) and fails if debug is disabled  
(Production mode for KSS). Both cases are tested for Production mode  
enable for KSS with @@kss_devel_mode/ui. Please, keep in mind - I  
have added semicolons to the code as you suggest in your response.

I have done deeper research with documenting what I do and let me  
give you this chart:

	- Debug mode for portal_javascript *disabled*
	        FF - works;
		Safari - works;
		Opera raises the error if "Open console on error" preference is  
enabled in browser. Traceback was provided in the previous email.  
Nothing happens in Opera if this property disabled in browser.
		IE6 - "Object doesn't support this property or method" JS error,  
when I try to click the link with KSS action attached
		IE7 - "Object doesn't support this property or method" JS error,  
when I try to click the link with KSS action attached. This browser  
has debugger enabled, so I have the exact place where the error  
appears in this browser. Here is that place - http://paste.plone.org/ 
16348. Lines 2,3 and 4 are the one line in debugger and have been  
torn only to show the error place on line 3 that shows debugger as  
the problematic.

	- Debug mode for portal_javascript *enabled*
		FF - works;
		Safari - works;
		Opera - works. No errors appear;
		IE6 - the same error
		IE7 - the same error and the same  line highlighted in debugger,  
but in more pretty form (since JS file is not merged and compressed  
in debug mode) - http://paste.plone.org/16349

This is what I have for testing of the action in browsers.

> Well if this is the case then there is chance you have a packing  
> problem.
> Since we apply safe packing on your plugin, if in Production mode.

What does "packing problem" mean? As I can see from the results there  
is something with packing, but when portal_javascript merges the  
files. I can tell this because Opera works in Debug mode and raises  
error in Production mode. Although this doesn't explain IE errors.

> Unfortunately it is quite easy to write code withoug noticing, that  
> will
> fail after packing. The packer itself contains bugs too. I have
> substantial experience in this since I have spent hours spotting  
> errors
> of this kind in the kss code. I can already see you have missing
> semicolons in your code:
>
>     objOverlay.onclick = function() {myBackdrop.end();}
>
> needs one in the end, and also,
>
>  arrayPageSize = new Array 
> (pageWidth,pageHeight,windowWidth,windowHeight)
>
> I cannot say if these solve the problem;

As I have wrote already this doesn't solve the problem and the chart  
above was done with those semicolons

> in addition to the plugin
> itself, could you provide an example html (like we do in kss.demo)  
> that
> enables me to test the plugin in a simple way? This could be a html  
> that
> also triggers the problem for you.

Not sure I can provide it in the way kss.demo is done, but HTML for  
this is the following:

HTML (simplified)
=====
<div id="test-wrapper">
<div class="tileItem visualIEFloatFix">

     <a href="/" class="tileImageWrapper">
         <img src="any_image.jpg" alt="" title="" height="112"  
width="150" class="tileImage" />
     </a>

</div>
</div>

KSS
====
#btest-wrapper a.tileImageWrapper:click {
     evt-click-preventdefault: true;
     action-client: shadeSite;
}
#test-wrapper a.tileImageWrapper img:click {
     evt-click-preventdefault: true;
     action-client: shadeSite;
}


Hope this will be enough for your testing.

Thank you.


------------------------------------------------------------------
Denis Mishunov           denis at webcouturier.com
WEB COUTURIER       info at webcouturier.com

Web Couturier - making a style in Plone themes.