vConsole appears on Android device.. how to hide?

Has anyone been able to sort this out???

It works great on desktop when i remove the
script js/vconsole.min.js

But if you remove this… then on Android… it just gives you a BLACK screen.
So one cannot just “delete” the js/vconsole.min.js"

So the question is… how can one just hide that button… see again post below

See post from Richard

Morning Ellis, Sorry but I tried lots of edits to the code behind the scenes and couldn’t stop it happening. Most of my clients now access via their computer so no longer a problem, wish I could have solved it properly though…

HI Richard. thanks for the feedback… yes its a weird one … also tried even removing all the code,.,…

and Style sheets within the js… but nothing helped… eish

Hey @ellis,

Thank you for reaching out to the Zoom Developer Forum. To make sure I’m clear, what methods have you tried when it comes to removing that button? Further, what version of the Web SDK are you seeing this with?

My understanding is that this issue isn’t present with the Local Package version of the SDK. Have you seen that same behavior?

Thanks,
Max

Im using this from your sample online.

https://github.com/zoom/sample-app-web
    <script src="https://source.zoom.us/1.9.6/lib/vendor/react.min.js"></script>
    <script src="https://source.zoom.us/1.9.6/lib/vendor/react-dom.min.js"></script>
    <script src="https://source.zoom.us/1.9.6/lib/vendor/redux.min.js"></script>
    <script src="https://source.zoom.us/1.9.6/lib/vendor/redux-thunk.min.js"></script>
    <script src="https://source.zoom.us/1.9.6/lib/vendor/lodash.min.js"></script>
    <script src="https://source.zoom.us/zoom-meeting-1.9.6.min.js"></script>
    <script src="js/tool.js"></script>
    <script src="js/vconsole.min.js"></script>
    <script src="js/meeting.js"></script>

but if i delete the line

<script src="js/vconsole.min.js"></script>

then it works great on desktop… but just gives me a BLACK screen on Android Mobile.

I have gone into the

vconsole.min.js

and deleted div tags… changed the styles to none; and even did this
and this is produced by vconsole.min.js (in js folder) but, for whatever reason, none of: * thanks Richard

document.getElementById("__vconsole").style.display=“none”;
document.getElementById("__vconsole").style.visibility=“hidden”;
document.getElementById("__vconsole").innerHTML.style.display=“none”;
document.getElementById("__vconsole").innerHTML="";

But nothing takes away the button that comes up on Android…

I have just used Richards pic… as i dont have another device… to take a photo again…
IMG_20201118_124334

Hey @ellis,

I really appreciate all that information, that’s very helpful. I need to set up my Android test device as I wasn’t seeing this on iOS. I’ll check this out and let you know what I see.

Mobile Browser Support

With that being said, I do want to mention there has been a recent change to the browsers that our Web SDK supports. If you check our browser support section you’ll see that we are no longer able to support mobile browsers.

While we didn’t want to make this change, it was with the goal of aligning with the support that we are able to provide with the current version as well as previous version of the SDK.

We understand that using the SDK with a mobile browser is a widely used use case and are working to expand platform support as soon as possible.

In the meantime, you may see that using the SDK works as expected, but we aren’t able to provide support for issues on mobile browsers specifically.

How I can Help

Regardless of the above, this is an interesting issue and as another developer I can see how this would be frustrating. After I set up my Android test device, I’ll look into this to see if I can offer any changes to the SDK that can be made to avoid this.

I’ll follow up as soon as I can.

Thanks,
Max

Thank you MaxM :slight_smile: its strange that is only on Android.
The best solution was just to remove the

<script src="js/vconsole.min.js"></script>

From the files included… but then you just end up with a black screen.
So somehow it requires the vconsole.min.js file…

Hey @ellis,

Thanks for your patience. I was able to use the following CSS rule to hide the vConsole button:

#__vconsole .vc-switch {
    display: none;
}

I hope that helps!

Thanks,
Max

Awesome let me give that a go :slight_smile:
thank you

where did you add this? to the meeting.php page… in the head ?
as it did not work for me?
Please can you advise where you added this please.

i have also within the vconsole.min.js edited this

#__vconsole .vc-switch {\n display: none;\n position: fixed…

SORTED!!! :slight_smile: you must also add the visibility:hidden;
@richard2

I added this to the meeting.php in the head…

<style>
#__vconsole .vc-switch {
    display: none;
	visibility:hidden;
}
</style>

and then in the vconsole.min.js search for #__vconsole .vc-switch {\n display: block; …

and make it

#__vconsole .vc-switch {\n  display: none; \n visibility:hidden;
1 Like

You are a star, look forward to giving it a go in our next update, thank you so much for sharing, it is really appreciated

Hey @ellis,

Awesome! I’m glad to hear that you were able to get that working.

Let us know if you run into any issues @richard2.

Thanks,
Max

Thanks for your help @MaxM and @richard2

1 Like

I’m happy to help! :slightly_smiling_face:

Max