Hello Jason, I tested a little bit new beta version of pie.js and I must say that so many errors at least on my project.
I'm debugging with ie8 developer tools , is not an awesome tool but you can see the error and line where the error is so what I found:

Unspecified error - Unspecified error. PIE.js, line 19 character 410: ( return e[d]||b.getAttribute(i)||e[g]||b.getAttribute(c) )
'right' is null or not an object - PIE.js, line 19 character 459: ( return e[d]||b.getAttribute(i)||e[g]||b.getAttribute(c) )
'left' is null or not an object - PIE.js, line 19 character 476: ( return e[d]||b.getAttribute(i)||e[g]||b.getAttribute(c) )
'null' is null or not an object PIE.js, line 21 character 318: ( return e[d]||b.getAttribute(i)||e[g]||b.getAttribute(c) )

seems to be the same part of code every time when I receive an error, unfortunately I cannot give you a page test because I tested on an internal app which use java + wicket and I cannot post ... but If you asking for something I'll be glad to help you with any test.

I'm using these scripts to call pie for my elements:

/*
PIE: CSS3 rendering for IE
*/
$(document).ready(function(){
if (window.PIE) {
$('#firstUl,.primary,.secondary,input[type = "text"], .currentPageTitle,.activeSaveHome,.removeArea,.draggable,.parent li,.tab-row ul li, .classForRadius,.tabContent,.etiRadius,.showAvailable a,.subTabsSecContainer,.tabCon,.tabSectionPad,.feedback-container,.feedback-tag,.dtcx').each(function(){
PIE.attach(this);
});
}
});



/*
PIE: detach and attach every time when the dom is modified.
*/

$(document).ready(function(){
try {
Wicket.Ajax.registerPostCallHandler(function(){
// console.log("start");
startPostAjax();
});
}
catch (error) {
// console.log(error);
}
});

function startPostAjax(){
pieStarter();
}

function pieStarter(){

if (window.PIE) {
go();
}
}
//
function go(){
$('.secondary,.primary,input[type = "text"],.removeactive,.parent li,.tab-row ul li,.classForRadius,.etiRadius,.showAvailable a,.subTabsSecContainer,.tabCon,.tabSectionPad,.feedback-container,.feedback-tag').each(function(){
PIE.detach(this);
});

$('.secondary, .primary,input[type = "text"],.removeactive,.parent li,.tab-row ul li,.classForRadius,.etiRadius,.showAvailable a,.subTabsSecContainer,.tabCon,.tabSectionPad,.feedback-container,.feedback-tag').each(function(){
PIE.attach(this);
});
}

Thank you.

I'm a bit confused by the error messages you posted. PIE 2 does not contain a file named PIE.js. I would expect your error messages to be from the PIE_IE678.js or PIE_IE9.js files. How are you including the js files?

Sorry I was not explicit enough

PIE_IE678.js renamed in PIE.js on my project so PIE.js is actually PIE_IE678.js.

thank you.

Can you use the _uncompressed file? That will give much more useful line numbers and let you see what the null variable is.

If you could catch that error in a debugger, see what element is triggering it, and let me know what that element's styles are, that would help.

A standalone testcase would of course be the most helpful.

This is the the buggy function and all errors I was talking about above are from here:
getLiveBounds: function() {
var el = this.targetElement,
rect = el.getBoundingClientRect(),
isIE9 = PIE.ieDocMode === 9,
isIE7 = PIE.ieVersion === 7,
width = rect.right - rect.left;
return {
x: rect.left,
y: rect.top,
// In some cases scrolling the page will cause IE9 to report incorrect dimensions
// in the rect returned by getBoundingClientRect, so we must query offsetWidth/Height
// instead. Also IE7 is inconsistent in using logical vs. device pixels in measurements
// so we must calculate the ratio and use it in certain places as a position adjustment.
w: isIE9 || isIE7 ? el.offsetWidth : width,
h: isIE9 || isIE7 ? el.offsetHeight : rect.bottom - rect.top,
logicalZoomRatio: ( isIE7 && width ) ? el.offsetWidth / width : 1
};
}

/**CSS**/
.secondary{
float: left;
margin-right: 9px;
font-family: museo500, sans-serif;
box-shadow: 0 0 2px 1px #ccc;
padding: 3px 7px;
font-weight: normal;
font-size: 11px;
color: #f5f5f5;
cursor:pointer;
border-radius:4px;
position:relative;
z-index:1;
background: -moz-linear-gradient(center top , #FF9172 0%, #FF0000 100%);
background: -webkit-linear-gradient(top, #FF9172 0%, #FF0000 100%);
background: -o-linear-gradient(top, #FF9172 0%,#ff0000 100%);
background: -ms-linear-gradient(top, #FF9172,#ff0000 100%);
-pie-background: linear-gradient(top, #FF9172, #ff0000 100%);
}



I think this "rect" is undefined and "width" too.
Maybe if we override "getBoundingClientRect" with "prototype" to return something dummy in order to not receive all the time that errors?
Pls see the print screen.
tell me how to proceed .
Thank you!

This sounds a lot like https://github.com/lojjic/PIE/issues/149

I'll tell you the same thing I've told the folks in that issue ticket: I'm more than happy to fix this, but I must first have a testcase for it. I've been unable to replicate it, so as soon as someone can provide me with a test document that throws the error then I'll get right on it. Until then, it's impossible for me to make and test a fix.

Strangely I have fixed that modifying my function for detach and attach:


//Optimized function but lower performance

$(document).ready(function(){
try {
Wicket.Ajax.registerPostCallHandler(function(){
attachPie();
});
Wicket.Ajax.registerPreCallHandler(function(){
detachPie();
});
}
catch (error) {
///console.log(error);
}
});


function attachPie(){

if (window.PIE) {
$('.secondary, .primary,input[type = "text"],.removeactive,.parent li, .pageNumber,.tab-row ul li,.classForRadius,.etiRadius,.showAvailable a,.subTabsSecContainer,.tabCon,.tabSectionPad,.feedback-container,.feedback-tag').each(function(){
PIE.attach(this);
});
}
}

function detachPie(){
if (window.PIE) {
$('.secondary,.primary,input[type = "text"],.removeactive,.parent li, .pageNumber,.tab-row ul li,.classForRadius,.etiRadius,.showAvailable a,.subTabsSecContainer,.tabCon,.tabSectionPad,.feedback-container,.feedback-tag').each(function(){
PIE.detach(this);
});
}
}

$.fn.exists = function(){
return this.length !== 0;
}