Bug 249044

Summary:

In a page that has an element with float and shape-outside, clicking a link crashes the tab

Product:

WebKit

Reporter:

Wes Souza <wesleydesouza>

Component:

CSS

Assignee:

Nobody <webkit-unassigned>

Status:

NEW ---

Severity:

Normal

CC:

bjonesbe, jensimmons, karlcow, webkit-bug-importer

Priority:

Keywords:

InRadar

Version:

Safari 16

Hardware:

iPhone / iPad

OS:

iOS 16

Attachments:

Description	Flags
Video capture of the issue on iOS 16.2 RC	none
crashing test	none

Description Wes Souza 2022-12-09 14:26:40 PST

Created attachment 463970 [details]
Video capture of the issue on iOS 16.2 RC

It seems if an element has CSS float and shape-outside set, long-pressing on links crashes the tab.

If the link opens in a new tab, clicking the link opens the same tab on a new tab.

  <div>Test</div>
  <a href="https://www.example.com/" target="_blank">Link</a>
  <style>
    div {
      float: right;
      shape-outside: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" preserveAspectRatio="none"><rect x="0" y="0" width="100" height="100"></rect></svg>');
    }
  </style>

Reproduction: https://codepen.io/wessouza/pen/VwdNbKK

Found by the Svelte team on https://kit.svelte.dev/ (fixed by removing the shape-outside property https://github.com/sveltejs/kit/pull/8028/files)

Comment 1 Radar WebKit Bug Importer 2022-12-09 14:32:46 PST

<rdar://problem/103194840>

Comment 2 Karl Dubost 2022-12-11 16:11:07 PST

Created attachment 463996 [details]
crashing test

Thanks a lot for the codepen.

From the discussion in https://github.com/sveltejs/kit/issues/8025
This happened on iOS Safari, but not iOS Firefox.

Let's convert the codepen as an individual test.