www.kayak.com - see bug description #2440
Labels
Milestone
Comments
|
Works on FF Dev Edition |
|
I can reproduce in 48 on OSX and Windows 10. Seems to be isolated to the Hotels page, if you switch to Flights or Cars, the images appear as they should and those errors don't appear in the console.
|
|
Spoofing the user agent in nightly (48) to 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:45.0) Gecko/20100101 Firefox/45.0' had no impact on the issue. Also spoofing the user agent in stable (45) to 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10.11; rv:48.0) Gecko/20100101 Firefox/48.0' did not make the issue reproduce either. |
|
Testing on Firefox Nightly 48.0a1 (2016-04-13) on OS X 10.11.4 (15E65) on a non retina device. On Firefox, the first image not displayed is a series of 3 ads above the hotels selection. <div class="col-fd-display-ad">
<div id="c1639012171" class="Common-Ads-DisplayAd location-left">
</div>
</div>On Safari, same location: <div class="col-fd-display-ad">
<div id="c6862314" class="Common-Ads-DisplayAd location-left">
<div id="google_ads_iframe_12907657/kayak/us/hotel/frontdoor_0__container__" style="border: 0pt none;">
<iframe id="google_ads_iframe_12907657/kayak/us/hotel/frontdoor_0" title="3rd party ad content" name="google_ads_iframe_12907657/kayak/us/hotel/frontdoor_0" width="300" height="250" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" src="javascript:"<html><body style='background:transparent'></body></html>"" style="border: 0px; vertical-align: bottom;"></iframe>
</div>
<iframe id="google_ads_iframe_12907657/kayak/us/hotel/frontdoor_0__hidden__" title="" name="google_ads_iframe_12907657/kayak/us/hotel/frontdoor_0__hidden__" width="0" height="0" scrolling="no" marginwidth="0" marginheight="0" frameborder="0" src="javascript:"<html><body style='background:transparent'></body></html>"" style="border: 0px; vertical-align: bottom; visibility: hidden; display: none;"></iframe>
</div>
</div>Let's see for the hotels images. Firefox: <div id="c108235202" class="Seo-Destinations-DestinationTile imageTile0 large" data-params="15830">
<a href="/New-York-Hotels.15830.hotel.ksp" class="photoContainer">
<img data-src="https://a3.r9cdn.net/rimg/dimg/c9/62/ee4b0ac7-city-15830-1525fbbd3e1.jpg?s14=1&width=496&height=332&crop=true&xhint=1957&yhint=1318" data-src-retina="https://a2.r9cdn.net/rimg/dimg/c9/62/ee4b0ac7-city-15830-1525fbbd3e1.jpg?s14=1&width=992&height=664&crop=true&xhint=1957&yhint=1318" class="photo">
</a>
<div id="c108235202-panel" class="panel">
<a class="panelTitleLink" href="/flight-routes/United-States-US0/United-States-US0">
Flights to United States </a>
<div class="panelComboHotels">
<a class="panelComboLink" href="/New-York-Hotels-The-Waldorf-Astoria.13467.ksp">
<span class="rate">$255+</span>
<span class="desc">The Waldorf Astoria</span>
</a>
<!-- … cute many of them -->
</div>
<div class="footer">
<a id="c108235202-toggle" href="javascript:void(0)" class="Common-Widgets-Toggle "></a>
<a href="/New-York-Hotels.15830.hotel.ksp" class="caption">
<span class="cheapest">$255+</span>
<span class="seoTitle"><b>New York</b> Hotels:</span>
</a>
</div>
</div>On Safari: <div id="c108235202" class="Seo-Destinations-DestinationTile imageTile0 large" data-params="15830">
<a href="/New-York-Hotels.15830.hotel.ksp" class="photoContainer">
<img data-src="https://a3.r9cdn.net/rimg/dimg/c9/62/ee4b0ac7-city-15830-1525fbbd3e1.jpg?s14=1&width=496&height=332&crop=true&xhint=1957&yhint=1318" data-src-retina="https://a2.r9cdn.net/rimg/dimg/c9/62/ee4b0ac7-city-15830-1525fbbd3e1.jpg?s14=1&width=992&height=664&crop=true&xhint=1957&yhint=1318" class="photo" src="https://a3.r9cdn.net/rimg/dimg/c9/62/ee4b0ac7-city-15830-1525fbbd3e1.jpg?s14=1&width=496&height=332&crop=true&xhint=1957&yhint=1318" style="opacity: 1;">
</a>
<div id="c108235202-panel" class="panel">
<a class="panelTitleLink" href="/flight-routes/United-States-US0/United-States-US0">
Flights to United States </a>
<div class="panelComboHotels">
<a class="panelComboLink" href="/New-York-Hotels-The-Waldorf-Astoria.13467.ksp">
<span class="rate">$255+</span>
<span class="desc">The Waldorf Astoria</span>
</a>
</div>
<div class="panelComboFlights">
</div>
</div>
<div class="footer">
<a id="c108235202-toggle" href="javascript:void(0)" class="Common-Widgets-Toggle "></a>
<a href="/New-York-Hotels.15830.hotel.ksp" class="caption">
<span class="cheapest">$255+</span>
<span class="seoTitle"><b>New York</b> Hotels:</span>
</a>
</div>
</div> |
|
To note that the <img
data-src="https://a3.r9cdn.net/rimg/dimg/c9/62/ee4b0ac7-city-15830-1525fbbd3e1.jpg?s14=1&width=496&height=332&crop=true&xhint=1957&yhint=1318"
data-src-retina="https://a2.r9cdn.net/rimg/dimg/c9/62/ee4b0ac7-city-15830-1525fbbd3e1.jpg?s14=1&width=992&height=664&crop=true&xhint=1957&yhint=1318"
class="photo"/>Looking at the debugger (function (b, a) {
b.createComponentClass('hotels.details.HotelDetailsPhotos', {
photoDialog: null,
virtualTour: false,
options: {
hotelId: 0,
virtualTour: false,
groups: 0
},
currentGroup: 0,
grid: null,
gridHeight: 724,
media: null,
init: function () {
var c = this;
var d = this.getChildElement('photoDialog').dialog({
onClose: function () {
b.events.publish('vfm.closeTour')
},
onOpen: function () {
b.events.publish('vfm.openTour')
}
});
c.photoDialog = d.getWidget();
c.element.find('img[data-src]').unveil(500, function () {
a(this).load(function () {
this.style.opacity = 1
})
});
c.element.find('img:visible').trigger('unveil');
c.grid = this.getChildElement('grid');
c.gridHeight = c.grid.height()
},
addEventHandlers: function () {
var c = this;
c.element.find('[data-lightbox=hotelDetailsPhoto]').click(function () {
b.Analytics.api.trackEvent('hotel/details/photos/photoOpened')
});
if (c.options.virtualTour) {
b.Analytics.api.trackEvent('hotel/details/photos/virtualTour');
this.getChildElement('virtualTourLink').click(function () {
b.Analytics.api.trackEvent('hotel/details/photos/virtualTour/opened');
c.openVirtualTour()
})
}
this.getChildElement('morePhotos').click(function () {
b.Analytics.api.trackEvent('hotel/details/photos/showMore/%s'.format(c.currentGroup + 1));
if (c.currentGroup < c.options.groups) {
c.element.find('.group-%s'.format(c.currentGroup + 1)).show().trigger('unveil');
c.currentGroup++;
c.grid.height(c.grid.height() + c.gridHeight)
}
if (c.currentGroup + 1 === c.options.groups) {
a(this).hide()
}
})
},
openVirtualTour: function () {
var c = this;
if (!c.virtualTour) {
b.ajax.execute('hotels/details/HotelDetailsVirtualTour', {
data: {
hid: c.options.hotelId
},
appendTo: c.getChildElement('virtualTour')
}).then(function (d) {
c.virtualTour = true;
c.photoDialog.open()
})
} else {
c.photoDialog.open()
}
}
})
}) |
|
Images are never loaded when you look in the network log. |
|
I tried with security.csp.enable = false and warning dissapear from console but still no images |
|
Thanks @lcamacho ! so we need to dig a bit more. :) |
|
Seems we found a real regression in the ECMAScript engine here - this is weird.. |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
URL: https://www.kayak.com/
Browser / Version: Firefox 48.0
Operating System: Mac OS X 10.11
Problem type: Something else - I'll add details below
Steps to Reproduce
Site is borked.
TypeError: a.unshift is not a functionglobalalien.js:34:19732
TypeError: f.shift is not a functionhorizon.js:1:151
TypeError: b.define is not a functioncommon.js:1:16
TypeError: b.createComponentClass is not a functionhotels.js:1:16
TypeError: b.createComponentClass is not a functionbase.js:1:16
TypeError: b.createComponentClass is not a functionmarketing.js:1:16
TypeError: b.createComponentClass is not a functionseo.js:1:16
TypeError: R9.ajax is undefined
From webcompat.com with ❤️
The text was updated successfully, but these errors were encountered: