Questions tagged [cross-browser]
Cross-browser development refers to the practice of building web sites, web applications, libraries, or components so that they function across different web browsers and rendering engines.
cross-browser
9,071
questions
0
votes
0
answers
21
views
setZoom not working in Chrome but is working in other browsers
I am unable to get setZoom or any of the zoom features to work on my leaflet map in Chrome.
It works fine in Firefox and Edge but I need it to work in Chrome also and cannot find anything on this.
Any ...
2
votes
1
answer
77
views
WakeLock API not working in Safari (iOS) but working in Windows/android platform with same code
I want to enable wake lock API. It is working fine with Windows platform and android devices but not in Safari or iOS devices.
Console has error NotAllowed, Permission was denied in Safari Browser.
I ...
0
votes
1
answer
35
views
Css range slider compatibility
I am making a website that has 2 separate range sliders using html, css and javascript. I am having real difficulty getting the range slider to work for CHROMIUM.
I have spent hours searching and ...
1
vote
1
answer
67
views
Transparency Issue with WebM Videos on Android Chrome Browser
The transparent WebM video, which appeared crisp on the Chrome browser on PC, shows jagged edges on the Android Chrome browser. Specifically, the edges of fine details like animal fur appear darker, ...
0
votes
0
answers
32
views
HTML Signature font Rendering Issue: Apple Mail Overrides Font-Family on Gmail Web Client
I'm facing an issue where the font-family styling applied to text elements in an HTML email signature is being overridden when the email is sent from the iPhone's Apple Mail app to a Gmail web client. ...
1
vote
1
answer
32
views
CSS Flip Card Scroll Issue in Firefox: Scrollbar Appears but doesn't work with mouse wheel
If I made a flip card like the one here flip_card, but and made the front-card and the back-card scrollable then the scrolling via mouse wheel only works with the back-card and the front-card only ...
0
votes
0
answers
13
views
Issue with Update Flow Not Working Across Application on Specific MacBook Pro Machine
I am encountering a peculiar issue with the update flow within our application, specifically on one machine, an Apple MacBook Pro 14 (M3) model. Despite functioning correctly on other devices, ...
1
vote
1
answer
58
views
Unable to upload PDF to S3 bucket via presigned URL created from my Node backend
Scenario:
Client (Nextjs client component) queries backend (NextJS rest endpoint) for pre-signed URL
Backend gets presigned URL for S3 via getSignedUrl
import { S3Client, PutObjectCommand } from &...
1
vote
1
answer
121
views
Getting requests.exceptions.InvalidHeader: Header part (1) from ('Sec-Gpc', 1) must be of type str or bytes, not <class 'int'> though Chrome sends it
I get requests.exceptions.InvalidHeader: Header part (1) from ('Sec-Gpc', 1) must be of type str or bytes, not <class 'int'> when trying to use the Sec-Gpc attribute in a header:
headers = {
...
0
votes
1
answer
60
views
window.open opens in new tab when in fullscreen browser mode in mac
I have following code in my Next.js function. I want the url to be opened in the same tab but in a new smaller window.
window.open(url, '_blank', features)
where features are,
const features = `width=...
2
votes
2
answers
54
views
What's the proper way of using a browser specific property in typescript?
Specifically, I'd like to use the "fileName" and other extra properties on the Error object in FireFox.
But something like this gives me red underlining, which I could simply ignore, but it ...
0
votes
0
answers
40
views
Issue with Adding Blocklists in uBlock Origin's Source Code via assets.json
I've recently cloned uBlock Origin's source code repository and attempted to add blocklists by editing the assets.json file. However, despite making the necessary changes, building the project using ...
0
votes
1
answer
66
views
Is there a standard way to handle network errors and blocked requests across browsers?
According to the fetch spec https://fetch.spec.whatwg.org/#concept-network-error network errors responses should have status 0. But for these error cases we see the browser implementation of the fetch ...
1
vote
0
answers
37
views
Is there another behavior besides margin collapsing that causes similar problems in Safari?
I seem to have ran into a margin collapsing problem only in Safari, yet none of the provided ways on stackoverflow about margin collapse seem to help.
Only in Safari, if you swipe all the way to the ...
1
vote
0
answers
39
views
How do I support old browsers in my create-react-app project?
I have an app that I built using create react app. I just found out that it needs to support a very old browser (chrome 37). I was under the impression that by default create react app uses babel to ...
0
votes
1
answer
59
views
Ellipsis is now shown with gradient text in Safari
I have a HTML block with the user icon and email, and the text color is gradient. The problem is when I shrink the screen to its minimum size, ellipsis is not displayed in Safari, although it works ...
1
vote
0
answers
20
views
HTML input file takes long time to open with Firefox and Ubuntu when running from embedded webserver
On my ESP32 Arduino application I run a simple form to upload a file:
function uploadFile() {
let file = document.getElementById("file1").files[0];
let formdata = new FormData();
formdata....
0
votes
1
answer
144
views
Media query to target safari browser version <= 15.x.x only
Can someone please let me know how we can target safari browser Version less than or equals 15.x.x using media query in css.
We have a bug where one element alignment is breaking in Safari Versions ...
0
votes
0
answers
31
views
Trouble Receiving Data from Front-End to Back-End Across Different Browsers and Devices
I'm encountering an issue with data reception from the front-end to the back-end. While sometimes I successfully receive data from one browser, it doesn't seem to work consistently across other ...
0
votes
0
answers
9
views
cross- browser issues.how to handle in code level
i have an issue in my css where on saafari alone min-width is not accepting but chrome is accepting min-width. how to handle this issue
0
votes
2
answers
90
views
File Format: WebM encoded with the VP8 codec is not previewing in Safari browser
We have developed a feature in our Angular application to create a video file using MediaRecorder APIs. This application is intended to work seamlessly across Chrome, Edge, and Safari browsers. Users ...
0
votes
0
answers
51
views
The .submit() function in JavaScript does not immediately submit the form on safari, leading to fields disabled after this is called not getting sent
I have a form on a website. Some of the html fields (they are <select> fields, if that is relevant) on this form are disabled to prevent the user sending changing the values in them, however, ...
1
vote
2
answers
39
views
How to align the last child of a table cell to the bottom of the cell?
I have a table with two divs inside a cell. I want the first div aligned to the top of the cell, and the last div aligned to the bottom. This is an example of what the table might look like:
<table&...
0
votes
0
answers
61
views
Refresh loses scrolling position on XML page rendered with XSLT
This is a publicly available webpage that can be used for testing. It is an XML page transformed into HTML by the browser via XSL transforms.
I noticed that Chrome browsers on MacOS loses the ...
0
votes
0
answers
26
views
Keep mobile browser top/bottom bars minimized unless user manually taps on them
I'm creating a React web-app for which I have separate design on desktop screen sizes and mobile screen sizes. I have started working on mobile portion and came across a problem of mobile browser bars ...
0
votes
1
answer
255
views
Polyfill for ReadableStream.from in browser?
ReadableStream.from for browsers is currently only supported in Firefox. I found the Node implementation in JavaScript, but it uses a lot of internal native node functions. Likewise, ReadableStream....
0
votes
0
answers
56
views
mix-blend-mode: color; is not working for <video> on iOS and Mac devices
Structure of hero banner:
<div className="hero-banner">
<video autoPlay muted loop playsInline className="hero-banner__video">
<source src="video.mp4"...
0
votes
0
answers
29
views
Capture files pending loading via JavaScript
I'm trying to capture the list of files that are pending loading, with more than 5 seconds of waiting, but I can only see this data after the file is loaded.
Does anyone have any idea how to get the ...
0
votes
0
answers
30
views
Polyfill for PerformanceObserver API to Implement Server Traffic Measurement
I'm currently utilizing the PerformanceObserver API to measure server traffic for given endpoints on the client side. However, I'm exploring alternative solutions due to potential limitations or lack ...
1
vote
0
answers
32
views
AfterViewChecked behaves differently in Chrome and Firefox
I've noticed that AfterViewChecked on Chrome behaves differently than it does to Firefox.
In my case on Chrome runs if there is a change in an Input data, on the other hand on Firefox it keeps ...
4
votes
1
answer
389
views
css grid with subgrid and overflow breaks on safari but works on all other browsers
I'm building a nested css grid with subgrids, but when using overflow:auto on the subgrid, the whole thing breaks on Safari.
On Chrome/FireFox it works great, but on Safari it breaks, and for some ...
1
vote
1
answer
56
views
Arrow Rotation and Scroll Reset Issue on Mobile Browsers
I am working on a webpage where I have implemented a feature to scroll to the top or bottom of the page with a triangle arrow that rotates based on the scroll direction. The functionality works well ...
0
votes
0
answers
27
views
Iframe : Reload back and forward Navigation
I am having an Main application in web and I want to reload different iframe( hosted on different servers) based on the option he choses in main Application.When I am reloading the application the ...
3
votes
1
answer
365
views
What causes gradient banding and how do you fix it?
Recently I was coding some linear and radial gradients, and I noticed they show up great in Chrome, but have banding in Safari. From the many other questions related to this topic, it seems that the ...
0
votes
0
answers
13
views
How do I use browser state change tracking for generated data [duplicate]
Lets say i have simple content editable rectangle on screen.
Here is its data;
{"left":438,"top":252,"width":410,"height":257}
Even if i put this in in some ...
0
votes
0
answers
62
views
How to set printing parameter on browser
The "set printing parameter" means be able to setting margin, paper size, font size, etc.
My project require to set default print setting based on different report user want to print. And I ...
0
votes
0
answers
19
views
How to tell pdf generation tool to make PDF of specific pixel width across devices (i.e. make PDF to display in browser using pixel dimensions)?
Background
I would like to do a preview of a PDF from LaTeX like Overleaf, sort of like their LaTeX text on the left and PDF preview on the right:
However, I am just going to be making math equations ...
0
votes
1
answer
102
views
Use height:100% inside a div with aspect-ratio set - bug in certain browsers?
Note: This question about a new feature in CSS: aspect-ratio. Most of the questions on this site with similar keywords are about very different techniques.
Ok so there's a div with the following ...
0
votes
0
answers
196
views
How to avoid auto-zoom / scale problem with Chrome in iOs
I did some testing on a client update for a Cargo Collective site.
http://thomasjpg.com
A Contact form was included for 480px width (mobile) and it sits at the foot of the page (see attachment).
I don'...
1
vote
2
answers
743
views
iFrame content refuses to load on iOS browsers only - even though a Content-Security-Policy (CSP) frame-ancestors directive is issued
I am creating a website (Site A) in a simple Content Management System. Because the CMS cannot interact with my data server, I have some web content hosted on another web server (Site B - subdomain....
0
votes
0
answers
21
views
Uncorrected behavior of transform-origin in safari browser
JS slider. The functionality is based on transform-origin: and transform: rotateY Appearance and code below. In all browsers is displayed correctly (as on the photo below). In Safari transform-origin ...
0
votes
0
answers
14
views
Parallel Execution of all cucumber scenarios in multiple browsers applicable [duplicate]
I am trying to achieve Parallel execution of all scenarios run in all the browsers.
High level Set Up:
Feature Files: I use multiple tags with same scenario like below
@chrome @firefox
Scenario :
...
0
votes
0
answers
53
views
"Parallel Execution Issue: Inconsistent Web Element Visibility and Accessibility, Timeout Errors Occurring"
Whenever I try to run the script in a single browser, the web elements are visible and accessible. However, during parallel execution, there was an issue where one browser frequently failed to locate ...
0
votes
0
answers
123
views
On Safari on mac OS, permissions API for geolocation gives "prompt", not "denied". How do I know if a permission was previously denied?
I am using On Safari 17.1.2 on mac OS 14.1.2
If I go to Settings > Websites > Location, and the website I'm only shows "Deny", this tells me that, for that website, the system will ...
2
votes
1
answer
115
views
What types of web resources can modern web browsers download in parallel? Also, what can't be downloaded in parallel?
What types of web resources can modern web browsers download in parallel? Also, what can't be downloaded in parallel?
Most answers on StackOverflow address "how many resources can be downloaded ...
2
votes
1
answer
116
views
Flexbox breaks with nested flex containers and writing-mode vertical-lr in Firefox
I'm experiencing a problem in Firefox when using vertical writing mode combined with two nested flex containers. Specifically, the second flex container doesn't expand to contain its children, ...
0
votes
0
answers
207
views
window.open() popup=1 does not open popup in Google Chrome
In my web application, I am using the following code to open a new window as a popup:
window.open(
'/auth',
'mypopup',
'popup=1,width=500,height=500'
);
This code works ...
3
votes
0
answers
133
views
Differences in Line Height and Position When Rendering Text with Canvas Across Browsers and Platforms
I've encountered a subtle issue while rendering text using Canvas on different browsers (Cairo (Node-Canvas), WebKit, Chromium) and operating systems (Windows, Mac, Linux). The line height and text ...
0
votes
0
answers
36
views
The web permissions API revoke() method is deprecated; what is the best way to revoke a permission such as 'geolocation'?
I am building a web interface which checks if the permission to use geolocation has already been granted using:
navigator.permissions.query({name:'geolocation'}).then(function(result) {
if (result....
0
votes
1
answer
44
views
diffrent views across browsers kin my React App
My website looks different from Chrome mobile view to Safari with an actual phone.
I have used prefixes for all my styles (WebKit,...)
I have also used normalize.css to fix any issue
I need help with ...