Closed Bug 1182861 Opened 4 years ago Closed 3 years ago

Hotspot Shield VPN upselling interception page has white background, since Landing of Bug 1176496, due to incorrect standardized gradient syntax

Categories

(Web Compatibility :: Desktop, defect)

Firefox 42
x86_64
Windows 7
defect
Not set

Tracking

(Not tracked)

RESOLVED WORKSFORME

People

(Reporter: over68, Unassigned)

References

()

Details

(Keywords: site-compat, Whiteboard: [suggested fix in comment 4] [contactready])

Attachments

(1 file)

The problematic part is:

background-image: linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
background-image: -o-linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
background-image: -moz-linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
background-image: -ms-linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
Blocks: 1176496
Component: General → Desktop
Flags: needinfo?(VYV03354)
Product: Core → Tech Evangelism
Summary: The background looks white → The background looks white since Landing of Bug 1176496
Version: 42 Branch → Firefox 42
> background-image: linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
This is broken. It doesn't take care of the syntax change of unprefixed gradients. The correct syntax is:
 background-image: linear-gradient(to top, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
Bug 1177263 will "fix" the problem because the CSS has -webkit prefixed gradients.
Depends on: 1177263
Flags: needinfo?(VYV03354)
Where is this testcase from? The dropbox-hosted initial testcase here says at the top...
> <!-- saved from url=(0079)http://techbrowsing.com/away.php?u=http%3A//www.techbrowsing.com/%3Ffrom%3Dland -->
...but that URL doesn't have anything that looks like the testcase to me.
Flags: needinfo?(over68)
Put another way: who do we need to contact to ask them to fix their syntax per comment 4, and what URL should we be asking them to fix? :)
Whiteboard: [suggested fix in comment 4]
Flags: needinfo?(over68)
I wonder if that's why the buttons on GMail look broken too.
Question in comment 5 still stands -- where is this gradient, on the techbrowsing.com? I don't see anything like it on the techland.com page. Comparing Firefox rendering vs. Chrome rendering, I don't see any obvious differences. And I don't see any mentions of "gradient" in the page's HTML source or in http://www.techbrowsing.com/style.css.

I'm guessing this might have been from an ad that periodically appears -- if so & you can still get that ad to load, could you provide the URL for that ad perhaps?

(In reply to Ryan VanderMeulen [:RyanVM UTC-4] from comment #7)
> I wonder if that's why the buttons on GMail look broken too.

(That's bug 1182775, looks like. Same issue, but with fix needed at different site -- let's discuss it over there.)
Flags: needinfo?(over68)
(In reply to Daniel Holbert [:dholbert] from comment #8)
> Question in comment 5 still stands -- where is this gradient, on the
> techbrowsing.com? I don't see anything like it on the techland.com page.
> Comparing Firefox rendering vs. Chrome rendering, I don't see any obvious
> differences. And I don't see any mentions of "gradient" in the page's HTML
> source or in http://www.techbrowsing.com/style.css.
> 
> I'm guessing this might have been from an ad that periodically appears -- if
> so & you can still get that ad to load, could you provide the URL for that
> ad perhaps?

This is the URL http://techbrowsing.com/away.php?u=http%3A//www.techbrowsing.com/%3Ffrom%3Dland.

This page is displayed automatically when i open the VPN program.

See https://dl.dropboxusercontent.com/u/95157096/85f61cf7/z4tqlz48s2.png
Flags: needinfo?(over68)
Ah. So that page is served *by* the VPN program itself, I think. (It doesn't exist on the internet for e.g. me to view, and it's not part of techbrowsing.com in any way.)

(When I visit that URL, I just end up at http://www.techbrowsing.com/, a news site front-page)

So, "Hotspot Shield" is who we need to contact about getting that CSS fixed.
Summary: The background looks white since Landing of Bug 1176496 → Hotspot Shield VPN upselling interception page white since Landing of Bug 1176496
Summary: Hotspot Shield VPN upselling interception page white since Landing of Bug 1176496 → Hotspot Shield VPN upselling interception page has white background, since Landing of Bug 1176496, due to incorrect standardized gradient syntax
[updating 'URL' to point to Hotspot Shield's main page, since that's ultimately where this issue seems to be (inside that software), rather than at techbrowsing.com.]
(In reply to Daniel Holbert [:dholbert] from comment #10)
> Ah. So that page is served *by* the VPN program itself, I think. (It doesn't
> exist on the internet for e.g. me to view, and it's not part of
> techbrowsing.com in any way.)
> 
> (When I visit that URL, I just end up at http://www.techbrowsing.com/, a
> news site front-page)

You can try to open the URL:

1. Download and open this https://dl.dropboxusercontent.com/u/95157096/85f61cf7/U1501.exe.
2. Go to the URL http://techbrowsing.com/away.php?u=http%3A//www.techbrowsing.com/%3Ffrom%3Dland.
What is that exe file? It's much smaller (2M) than the installer that Hotspot Shield links to on their page (9.8M)...  If you'd like to provide steps to reproduce, it'd probably help to start from with "download the Hotspot installer from this official spot on their web site" :)

Also, I'm running Linux locally, so I personally can't open that file.

(But I'm also happy to take your word for it that their software has this problem, without running any exe files, myself given your screenshot & HTML-snippet.)

The next steps here are probably for some Mozilla person (perhaps from the web compatibility team) to reach out to Hotspot Shield and see if they can fix this using comment 4.
(In reply to Daniel Holbert [:dholbert] from comment #13)
> What is that exe file? It's much smaller (2M) than the installer that Hotspot Shield links to on their
> page (9.8M)...

This is Ultrasurf proxy software.
@blinky The issue is happening for you with this ultrasurf proxy too?


PS: Sharing ".exe" is usually not a very good idea. There is a trust issue. ;)
Hotspot Shield Elite is https://www.hsselite.com/


The button in their home page has the same issue.

``` css

.btn_buy b,.btn_buy_elite, .formLoginBtn b {font-size:12px; color:#FFF; background:#ED810D; padding:5px 10px; display:block;

background-image: linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
background-image: -o-linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
background-image: -moz-linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);
background-image: -ms-linear-gradient(bottom, rgb(237,129,13) 0%, rgb(244,183,28) 100%);

-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: 0 0 2px rgba(0,0,0,1), 0 1px 0px rgba(255,255,255,0.5) inset;
-webkit-box-shadow: 0 0 2px rgba(0,0,0,1), 0 1px 0px rgba(255,255,255,0.5) inset;
box-shadow: 0 0 2px rgba(0,0,0,1), 0 1px 0px rgba(255,255,255,0.5) inset;
text-shadow: rgba(0,0,0,0.5) 0px 1px 0px;}

```


It can be fixed with 

``` css
background: linear-gradient(to bottom, #ed810d 0%,#f4b71c 100%);border-radius: 10px;
```
(In reply to Karl Dubost :karlcow from comment #15)
> @blinky The issue is happening for you with this ultrasurf proxy too?

I mean you can open the URL from comment 5 with ultrasurf proxy.
@blinky, probably but it has nothing to do with the issue. :) See Comment #16
On Nightly it is fixed through the support of webkit prefixes. 
I will close it as worksforme.

but feel free to contact them to get them to support standard CSS.
For technical support inquiries, please send an email to:
support@hsselite.com
Status: UNCONFIRMED → RESOLVED
Closed: 3 years ago
Resolution: --- → WORKSFORME
Whiteboard: [suggested fix in comment 4] → [suggested fix in comment 4] [contactready]
Product: Tech Evangelism → Web Compatibility
You need to log in before you can comment on or make changes to this bug.