The site doesn’t work, I have javaScript & cookies turned on in my browser.

Standard

Problem

it’s hard resolving issues at a customer’s end because you don’t know what the state of their machine is in. You can do your best by gathering information from the client as to the behavior of the problem and go hunting for the solution after politely saying, “I will look into it”.

After all, the customer is always right.  JavaScript and Cookies are used by  lots of web applications and yet, it amazing how many browser currently in existence don’t have those features turned on. I understand the security risk of JavaScript but … So in such a situation, what do you do. Customers will always tell you they did exactly what you told them to do but it’s hard to know if they “actually” followed your steps to rectify the problem.

 

Solution

Relying on the Customer is great but proof is even better. Showing user browser configuration settings in your web application can be very helpful in addressing some of these issues. See example of such a configuration display below.

image 

image

image

This is all great but unfortunately, extracting this information for the browser can be tedious since they are no consistent amongst all browsers. Below is a JavaScript snippet which provides you with the above browser settings for IE, Firefox, Opera and Safari.

 

<script type="text/javascript"> 
  

function showBrowserConfigurationResult() {

    $get("browser_type_check").innerHTML = getBrowserType();
    
    $get("browser_version_check").innerHTML = checkBrowserVersion();

    $get("js_check").innerHTML      = "Yes";

    $get("cookie_check").innerHTML  = getCookieStatus();
    
    $get("platform_check").innerHTML = getPlatformStatus();
    
     $get("screenresolution_check").innerHTML = getScreenResolutionStatus();

}


function getBrowserType() {
   
     if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)){ //test for MSIE x.x;
       return "Internet Explorer";
     }
     else if (/Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent)){ //test for Firefox/x.x or Firefox x.x (ignoring remaining digits);
        return "Firefox";
      }
      else if (/Opera[\/\s](\d+\.\d+)/.test(navigator.userAgent)){ //test for Opera/x.x or Opera x.x (ignoring remaining decimal places);
        return "Opera";
      }
      else if(/Safari/.test(navigator.userAgent)){
      return "Safari";
      }
      else
      {
        return navigator.appCodeName;
      }
    
}

function checkBrowserVersion() {
   
    
    if (/MSIE (\d+\.\d+);/.test(navigator.userAgent)){ //test for MSIE x.x;
     var ieversion=new Number(RegExp.$1) // capture x.x portion and store as a number
     
         if (ieversion>=8)
          return "8.x";
         else if (ieversion>=7)
         return "7.x";
         else if (ieversion>=6)
         return "6.x";
         else if (ieversion>=5)
          return "5.x";
         else
            return "n/a";
      
      }
     else if (/Firefox[\/\s](\d+\.\d+)/.test(navigator.userAgent)){ //test for Firefox/x.x or Firefox x.x (ignoring remaining digits);
       var ffversion=new Number(RegExp.$1) // capture x.x portion and store as a number
       
     if (ffversion>=3)
      return "3.x or above";
     else if (ffversion>=2)
      return "2.x";
     else if (ffversion>=1)
      return "1.x"
     else
       return "n/a";
      
    }
    else if (/Opera[\/\s](\d+\.\d+)/.test(navigator.userAgent)){ //test for Opera/x.x or Opera x.x (ignoring remaining decimal places);
     var oprversion=new Number(RegExp.$1) // capture x.x portion and store as a number
     if (oprversion>=10)
      return "10.x or above";
     else if (oprversion>=9)
     return  "9.x";
     else if (oprversion>=8)
      return "8.x";
     else if (oprversion>=7)
      return "7.x";
     else
      return "n/a";
    }
    else if(/Safari/.test(navigator.userAgent)){
      var safversion = /Version\/\d\.\d\.\d*/.exec(navigator.userAgent)
      safversion = /\d/.exec(safversion)
     if (safversion>=3)
      return "3.x or above";
     else if (safversion>=2)
     return  "2.x";
     else if (safversion>=1)
      return "1.x";
     else
      return "n/a";
     
     
    }
    else 
    {
      return  navigator.appVersion;
    }
}


function getCookieStatus() {

   if(navigator.cookieEnabled) 
      return "Yes"; 
   else 
     return "No" ;

}

function getPlatformStatus()
{
   return navigator.platform;
}

function getScreenResolutionStatus()
{
  return screen.width+" x "+screen.height;
}

 </script>

 

$get(“ x”) is a jquery function that returns the element with id=”x”. If you are not using jquery, you can replace $get() with the JavaScript function  getElementbyId(“x”)  and that should rectify the problem. Enjoy.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s