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.

Sign up for GitHub

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

Jump to bottom

Widget API Play issue with Instagram In-App Browser #233

Open
PWaddict opened this issue Dec 16, 2022 · 1 comment
Open

Widget API Play issue with Instagram In-App Browser #233

PWaddict opened this issue Dec 16, 2022 · 1 comment

Comments

@PWaddict
Copy link

PWaddict commented Dec 16, 2022 •
edited

Hello!

I'm testing the Widget API on various browsers to make sure it's working properly and for some reason it doesn't work on Instagram in-app browser. This is driving me crazy. Am I missing something? Is there a special "hack" I have to apply on play()?

The Widget API works fine on the following tested browsers:

Desktop (Windows)
Chrome
Firefox
Edge
Opera

Mobile (Android)
Chrome
Firefox
Edge
Opera
Samsung Internet
Facebook In-App Browser

Steps to reproduce:

1. Upload an html file to your server with the below code:

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="robots" content="noindex, nofollow">
</head>

<body>
    <iframe id="soundcloud_widget"
        src="https://w.soundcloud.com/player/?url=https://api.soundcloud.com/users/1539950/favorites" width="100%"
        height="400px" scrolling="no" frameborder="no" allow="autoplay"></iframe>

    <br><br>
    <button id="play" type="button">Play</button>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
    <script src="https://w.soundcloud.com/player/api.js"></script>
    <script>
        $(document).ready(function () {
            var widget = SC.Widget(document.getElementById('soundcloud_widget'));
            widget.bind(SC.Widget.Events.READY, function () {
                console.log('Ready...');
            });

            $('#play').click(function () {
                widget.play();
            });
        });
    </script>
</body>

</html>

2. Add the link of the above page on your Instagram profile link field.
3. Then go to your profile page and click on your link to open it with Instagram in-app browser and press the custom "Play" button under the embedded player.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
2 participants
@PWaddict and others