Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not working on latest Webkit Nightlies #37

Open
jaukia opened this issue Mar 20, 2013 · 12 comments
Open

Not working on latest Webkit Nightlies #37

jaukia opened this issue Mar 20, 2013 · 12 comments

Comments

@jaukia
Copy link

jaukia commented Mar 20, 2013

In the latest webkit nightlies the zoom level is not detected. This is possibly due to the fact that "document.body.style.webkitTextSizeAdjust" returns undefined (not a string) on the webkit nightly.

My Webkit Nightly (Safari) version:
6.0.1 (8536.26.14, 537+)

Operating system: Os X

Screen Shot 2013-03-20 at 1 51 30 PM

@jaukia
Copy link
Author

jaukia commented Mar 20, 2013

Adding this would seem to help:

    //WebKit
    else if (typeof document.body.style.webkitTextSizeAdjust === 'string') {
        func = webkit;
    }
    //New WebKit Nightlies
    else if (typeof document.body.style.webkitTransform === 'string') {
        func = opera11;
    }
    //Opera
    else if (navigator.userAgent.indexOf('Opera') >= 0) {
        func = opera11;
    }

@tombigel
Copy link
Owner

Thank you, but I'm not testing against nightlies. It's impossible to track all Moz/Webkit/Opera nightlies and their short living bugs and new features.

I will have of course to check periodically to se if any of the prefixed properties I'm using have been removed or changed.

@jaukia
Copy link
Author

jaukia commented Mar 29, 2013

Ok. I would assume this to break fairly soon in Safari/Chrome as well, but let's see.

@tombigel
Copy link
Owner

tombigel commented Apr 1, 2013

Well well... https://bugs.webkit.org/show_bug.cgi?id=56543

Need to find another way. Question is, should I use some other feature detection, or should I just sniff the user agent since it's becoming to stupid to track all the versions of everything...?

@tombigel tombigel reopened this Apr 1, 2013
@PoyangLiu
Copy link

My coworker and I dynamically created a svg element and check its currentScale property. It works great on Chrome and likely most browsers too. It works sometimes on FF if the zoom text only feature is turned off.

var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
svg.setAttribute('version', '1.1');
document.body.appendChild(svg);
var z = svg.currentScale;

@tombigel
Copy link
Owner

@PoyangLiu very interesting! I'll look into it, thanks

@tombigel
Copy link
Owner

@PoyangLiu I wrote this fiddle - http://jsfiddle.net/tombigel/HzQwr/
Scale is always 1.

Am I doing something wrong?

@PoyangLiu
Copy link

Your window.out definition should be in the body tag or after window is loaded. I couldn't get your fiddle to work even with the various options though. Maybe JSFiddle's options (eg. OnLoad) are not working?

<!DOCTYPE html>
<html >
<head>
    <script>
        function getScale() {
            var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
            svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
            svg.setAttribute('version', '1.1');
            document.body.appendChild(svg);
            var scale = svg.currentScale;
            document.body.removeChild(svg);

            scale = Math.round(scale * 100) / 100;
            return scale;
        };
        function updateScale() {
            document.getElementById('out').innerHTML = getScale();
        };
        window.addEventListener('resize', function (e) {
            updateScale();
        });
        window.addEventListener('load', function (e) {
            updateScale();
        });
    </script>
</head>
<body>
    Scale: <div id="out">Scale</div><br>
</body>
</html>

@tombigel
Copy link
Owner

Ok, something in jsFiddle breaking it, you html works for me.

Do you have a retina mac around to see what is the initial scale on retina displays?

@kribblo
Copy link
Contributor

kribblo commented Apr 22, 2013

1.0.4 has stopped working in Chrome Betas, only returns 1 for detectZoom.device(). I can't be 100% sure when it worked last, but within 2 weeks certainly, and probably last week as well.

My exact version as of now is Version 27.0.1453.56 beta-m, I forgot to note the version before that also had the same problem.

Combined the info in above comment with 1.0.4 and changed the webkit function to:

    var webkit = function () {
        var svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
        svg.setAttribute('xmlns', 'http://www.w3.org/2000/svg');
        svg.setAttribute('version', '1.1');
        document.body.appendChild(svg);
        var zoom = svg.currentScale;
        document.body.removeChild(svg);

        zoom = Math.round(zoom * 100) / 100;

        return {
            zoom: zoom,
            devicePxPerCssPx: zoom * devicePixelRatio()
        };
    };

This works, where the <div> implementation does not.

Note however that I have not been able to test this in older webkit!

@PoyangLiu
Copy link

@tombigel . Sorry, I don't have retina mac for testing.

@PoyangLiu
Copy link

There's always something.... Just discover that this won't work if the svg is within an iframe because the scale of the svg is relative of the frame that encloses it. TestScale.htm is the code I pasted in the previous comment.

<!DOCTYPE html>
<html >
<head>
</head>
<body>
    <iframe id="myFrame" src="TestScale.htm"></iframe>
</body>
</html>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants