RESOLVED CONFIGURATION CHANGED 20269
Removing a Background Picture via Javascript does not remove the picture 
https://bugs.webkit.org/show_bug.cgi?id=20269
Summary Removing a Background Picture via Javascript does not remove the picture
fALk Gaertner
Reported 2008-08-03 12:24:04 PDT
Sorry I don´t have a test case on the web yet but its easy to recreate and completely repeatable. It does not happen with Safari release version nor with Firefox. If you change a background image from an : url (path/to/background/image.png) -xx -xx no-repeat; to nothing via Javascript the image stays instead of being removed (the behavior it had up to now) The switch goes between: document.getElementById('someID').style.background = "url (path/to/background/image.png) -xxpx -yypx no-repeat"; and: document.getElementById('someID').style.background = ""; the second line of code should remove the picture div/li/span but the picture stays and get not removed even if you try to set it to a different picture later in time. If that all aint make any sense I try to spend the time to create a test case (the test case I have I am not allowed to share at the moment as its an internal website)
Attachments
screen recording of test case working (can delete this one, I didn't add -xx -xx no-repeat) (3.60 MB, video/quicktime)
2024-04-24 13:58 PDT, Frances Cornwall 		no flags
Details
screen recording of test case (414.87 KB, video/quicktime)
2024-04-24 14:07 PDT, Frances Cornwall 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Frances Cornwall
Comment 1 2024-04-24 13:58:01 PDT
Created attachment 471111 [details] screen recording of test case working (can delete this one, I didn't add -xx -xx no-repeat)
Frances Cornwall
Comment 2 2024-04-24 14:07:39 PDT
Created attachment 471113 [details] screen recording of test case
Frances Cornwall
Comment 3 2024-04-24 14:10:31 PDT
Here is the code behind the test case where it is working in Safari 17.4.1: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title></title> </head> <body style="background: url('https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQccs1a2okUBYX1yvmdyQSjzVCb2cS3GqhCml3ekj2GoA&s') -20px -20px no-repeat;"> <button id="changeBackgroundButton">Change Background</button> <script> const changeBackgroundButton = document.getElementById('changeBackgroundButton'); changeBackgroundButton.addEventListener('click', function() { document.body.style.background = ''; }); </script> </body> </html>
Note You need to log in before you can comment on or make changes to this bug.