1922300 - Implement the view transition layer

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta property="og:type" content="website"> <meta property="og:title" content="1922300 - Implement the view transition layer"> <meta property="og:url" content="https://bugzilla.mozilla.org/show_bug.cgi?id=1922300"> <meta property="og:description" content="ASSIGNED (emilio) in Core - CSS Parsing and Computation. Last updated 2025-02-25."> <meta name="twitter:label1" value="Type"> <meta name="twitter:data1" value="task"> <meta name="twitter:label2" value="Priority"> <meta name="twitter:data2" value="--"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> <meta name="color-scheme" content="dark light"> <meta name="generator" content="Bugzilla 20250219.1"> <meta name="bugzilla-global" content="dummy" id="bugzilla-global" data-bugzilla="{"api_token":"","config":{"basepath":"\/","cookie_consent_enabled":"1","cookie_consent_required":0,"essential_cookies":["bugzilla","Bugzilla_login","Bugzilla_logincookie","Bugzilla_login_request_cookie","github_state","github_token","mfa_verification_token","moz-consent-pref","sudo"],"urlbase":"https:\/\/bugzilla.mozilla.org\/"},"constant":{"COMMENT_COLS":80},"param":{"maxattachmentsize":"10240","maxusermatches":"50","splinter_base":"\/page.cgi?id=splinter.html&ignore=\/","use_markdown":"1"},"string":{"TextEditor":{"command_bold":"Bold","command_bulleted_list":"Bulleted list","command_code":"Code","command_heading":"Heading","command_italic":"Italic","command_link":"Link","command_numbered_list":"Numbered list","command_quote":"Quote","comment_editor":"Comment Editor","edit":"Edit","etiquette_link":{"href":"page.cgi?id=etiquette.html","text":"Etiquette"},"guidelines_link":{"href":"page.cgi?id=bug-writing.html","text":"Bug Writing Guidelines"},"loading":"Loading…","markdown_link":{"href":"https:\/\/guides.github.com\/features\/mastering-markdown\/","text":"Markdown supported"},"preview":"Preview","preview_error":"Preview could not be loaded. Please try again later.","text_editor":"Text Editor","toolbar_label":"Markdown text-formatting toolbar"},"bug":"bug","bug_type_required":"You must select a Type for this bug","component_required":"You must select a Component for this bug","description_required":"You must enter a Description for this bug","short_desc_required":"You must enter a Summary for this bug","version_required":"You must select a Version for this bug"},"user":{"cookie_consent":"","is_new":true,"login":""}}"> <meta name="google-site-verification" content="JYXIuR9cAlV7fLmglSrc_4UaJS6Wzh5Mdxiorqu5AQc" /> <title>1922300 - Implement the view transition layer</title> <link href="/static/v20250219.1/skins/standard/global.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/extensions/BugModal/web/bug_modal.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/js/jquery/plugins/contextMenu/contextMenu.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/extensions/BMO/web/styles/bug_modal.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/extensions/EditComments/web/styles/inline-comment-editor.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/js/jquery/ui/jquery-ui-min.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/js/jquery/ui/jquery-ui-structure-min.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/js/jquery/ui/jquery-ui-theme-min.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/skins/lib/prism.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/skins/standard/consent.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/extensions/Needinfo/web/styles/needinfo.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/extensions/Review/web/styles/badge.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/extensions/Review/web/styles/review.css" rel="stylesheet" type="text/css"><link href="/static/v20250219.1/skins/standard/text-editor.css" rel="stylesheet" type="text/css"> <script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/jquery/jquery-min.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/jquery/ui/jquery-ui-min.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/jquery/plugins/contextMenu/contextMenu-min.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/jquery/plugins/devbridgeAutocomplete/devbridgeAutocomplete-min.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/global.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/util.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/widgets.js"></script> <script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc">BUGZILLA.value_descs = JSON.parse('{\"bug_status\":{},\"resolution\":{\"\":\"---\"}}'); var tracking_flags_str = "{\"types\":[\"tracking\"],\"comments\":{\"cf_tracking_firefox136\":{\"?\":\"[Tracking Requested - why for this release]:\"},\"cf_tracking_firefox_esr115\":{\"?\":\"[Tracking Requested - why for this release]:\"},\"cf_a11y_review_project_flag\":{\"requested\":\"Description:\\nPlease provide an explanation of the feature or change. Include a description of the user scenario in which it would be used and how the user would complete the task(s).\\nScreenshots and visual UI specs are welcome, but please include sufficient accompanying explanation so that blind members of the accessibility team are able to understand the feature\/change.\\n\\nHow do we test this?\\nIf there is an implementation to test, please provide instructions for testing it; e.g. setting preferences, other preparation, how to trigger the UI, etc.\\n\\nWhen will this ship?\\nTracking bug\/issue:\\nDesign documents (e.g. Product Requirements Document, UI spec):\\nEngineering lead:\\nProduct manager:\\n\\nThe accessibility team has developed the Mozilla Accessibility Release Guidelines which outline what is needed to make user interfaces accessible:\\nhttps:\/\/wiki.mozilla.org\/Accessibility\/Guidelines\\nPlease describe the accessibility guidelines you considered and what steps you\'ve taken to address them:\\n\\nDescribe any areas of concern to which you want the accessibility team to give special attention:\"},\"cf_tracking_firefox137\":{\"?\":\"[Tracking Requested - why for this release]:\"},\"cf_tracking_firefox_relnote\":{\"?\":\"Release Note Request (optional, but appreciated)\\n[Why is this notable]:\\n[Affects Firefox for Android]:\\n[Suggested wording]:\\n[Links (documentation, blog post, etc)]:\"},\"cf_tracking_firefox_esr128\":{\"?\":\"[Tracking Requested - why for this release]:\"},\"cf_tracking_firefox135\":{\"?\":\"[Tracking Requested - why for this release]:\"}},\"flags\":{\"project\":{\"cf_accessibility_severity\":\"---\",\"cf_performance_impact\":\"---\",\"cf_a11y_review_project_flag\":\"---\",\"cf_webcompat_score\":\"---\",\"cf_webcompat_priority\":\"---\"},\"tracking\":{\"cf_tracking_firefox137\":\"---\",\"cf_status_thunderbird_esr115\":\"---\",\"cf_tracking_firefox_esr128\":\"---\",\"cf_tracking_firefox_esr115\":\"---\",\"cf_status_firefox137\":\"---\",\"cf_tracking_thunderbird_esr128\":\"---\",\"cf_tracking_firefox_relnote\":\"---\",\"cf_tracking_thunderbird_esr115\":\"---\",\"cf_status_firefox_esr128\":\"---\",\"cf_tracking_firefox135\":\"---\",\"cf_status_firefox135\":\"---\",\"cf_tracking_firefox136\":\"---\",\"cf_status_firefox136\":\"---\",\"cf_status_firefox_esr115\":\"---\",\"cf_status_thunderbird_esr128\":\"---\"}}}"; var TrackingFlags = $.parseJSON(tracking_flags_str); BUGZILLA.bug_id = 1922300; BUGZILLA.bug_title = '1922300 - Implement the view transition layer'; BUGZILLA.bug_summary = 'Implement the view transition layer'; BUGZILLA.bug_url = 'https:\/\/bugzilla.mozilla.org\/show_bug.cgi?id=1922300'; BUGZILLA.bug_keywords = '', BUGZILLA.bug_secure = false; BUGZILLA.user = { id: 0, login: '', is_insider: false, is_timetracker: false, can_tag: false, can_triage: false, timezone: 'America\/Los_Angeles', settings: { quote_replies: 'quoted_reply', zoom_textareas: true, remember_collapsed: true, inline_attachments: true, autosize_comments: false }, cookie_consent: false }; review_suggestions = { _mentors: [ ], 'CSS Parsing and Computation': [ ], _end: 1 }; static_component = 'CSS Parsing and Computation'; </script> <script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/text-editor.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/BugModal/web/autosize.min.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/ProdCompSearch/web/js/prod_comp_search.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/BugModal/web/attachments_overlay.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/BugModal/web/bug_modal.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/BugModal/web/comments.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/ComponentWatching/web/js/overlay.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/bugzilla-readable-status-min.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/field.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/comments.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/util.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/TrackingFlags/web/js/flags.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/BMO/web/js/firefox-crash-table.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/MozChangeField/web/js/severity-s1-priority-p1.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/MozChangeField/web/js/clear-tracking-priority-s1.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/MozChangeField/web/js/set-tracking-severity-s1.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/lib/prism.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/consent.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/cookie-helper.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/js/lib/md5.min.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/Review/web/js/badge.js"></script><script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/Review/web/js/review.js"></script> <link href="/static/v20250219.1/skins/lib/fontawesome.min.css" rel="stylesheet" type="text/css"> <link href="/static/v20250219.1/skins/lib/fontawesome-brands.min.css" rel="stylesheet" type="text/css"> <link href="/static/v20250219.1/skins/lib/fontawesome-solid.min.css" rel="stylesheet" type="text/css"> <link rel="search" type="application/opensearchdescription+xml" title="Bugzilla@Mozilla" href="/search_plugin.cgi"><link rel="shortcut icon" href="/extensions/BMO/web/images/favicon.ico"> <link rel="icon" type="image/svg+xml" href="/extensions/BMO/web/images/favicon.svg"> <link rel="canonical" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1922300"> <link rel="shorturl" href="https://bugzilla.mozilla.org/1922300"><meta name="robots" content="noarchive"> </head> <body class="bugzilla-mozilla-org skin-standard bug_modal"> <div id="wrapper"> <header id="header" role="banner" aria-label="Global Header"> <div class="inner" role="none"> <button type="button" class="iconic ghost" id="open-menu-drawer" aria-label="Open Site Menu"> <span class="icon" aria-hidden="true" data-icon="menu"></span> </button><div id="header-external-links" class="dropdown" role="none"> <button type="button" id="header-external-menu-button" class="dropdown-button minor" aria-label="Show Mozilla Menu" aria-expanded="false" aria-haspopup="true" aria-controls="header-external-menu"> <img src="/static/v20250219.1/extensions/BMO/web/images/moz-fav-one-color-white-rgb.svg" width="32" height="32" alt=""> </button> <ul class="dropdown-content right" id="header-external-menu" role="menu" aria-label="Mozilla Menu" style="display:none;"> <li role="none"> <a href="https://www.mozilla.org/" role="menuitem"> <span class="label" role="none">Mozilla Home</span> </a> </li> <li role="separator"></li> <li role="none"> <a href="https://www.mozilla.org/privacy/websites/" role="menuitem"> <span class="label" role="none">Privacy</span> </a> </li> <li role="none"> <a href="https://www.mozilla.org/privacy/websites/#cookies" role="menuitem"> <span class="label" role="none">Cookies</span> </a> </li> <li role="none"> <a href="https://www.mozilla.org/about/legal/" role="menuitem"> <span class="label" role="none">Legal</span> </a> </li> </ul> </div> <h1 id="header-title" class="title" role="none"> <a class="header-button" href="https://bugzilla.mozilla.org/home" title="Go to home page"> <span aria-label="Go to Bugzilla Home Page">Bugzilla</span> </a> </h1> <form id="header-search" class="quicksearch" action="/buglist.cgi" data-no-csrf role="search" aria-label="Search Bugs"> <button type="button" class="iconic ghost" id="show-searchbox" aria-label="Search Bugs"> <span class="icon" aria-hidden="true" data-icon="search"></span> </button> <div class="searchbox-outer dropdown" role="combobox" aria-label="Quick Search" aria-haspopup="listbox" aria-owns="header-search-dropdown" aria-expanded="false"> <span class="icon" aria-hidden="true" data-icon="search"></span> <input id="quicksearch_top" class="dropdown-button" name="quicksearch" autocomplete="off" value="" accesskey="s" placeholder="Search Bugs" title="Enter a bug number or some search terms" role="searchbox" aria-controls="header-search-dropdown" aria-label="Search Terms"><div id="header-search-dropdown" class="dropdown-content dropdown-panel right" role="listbox" style="display: none;"> <div id="header-search-dropdown-wrapper" role="none"> <section id="header-search-dropdown-help" role="group" aria-label="Help"> <footer role="none"> <a href="/page.cgi?id=quicksearch.html">Quick Search Tips</a> <a href="/query.cgi?format=advanced">Advanced Search</a> </footer> </section> </div> </div> </div> </form> <nav id="header-nav" role="menubar" aria-label="Site Links"> <ul class="links" role="none"><li role="none"> <a class="header-button" href="/describecomponents.cgi" title="Browse bugs by component" role="menuitem"> <span class="icon" aria-hidden="true" data-icon="category"></span> <span class="label" role="none">Browse</span> </a> </li> <li role="none"> <a class="header-button" href="/query.cgi?format=advanced" title="Search bugs using various criteria" role="menuitem"> <span class="icon" aria-hidden="true" data-icon="pageview"></span> <span class="label" role="none">Advanced Search</span> </a> </li> <li role="none"> <a class="header-button" href="/enter_bug.cgi" title="File a new bug" role="menuitem"> <span class="icon" aria-hidden="true" data-icon="add_box"></span> <span class="label" role="none">New Bug</span> </a> </li> </ul> <div class="dropdown" role="none"> <button type="button" id="header-tools-menu-button" class="header-button dropdown-button minor" title="More tools…" role="menuitem" aria-label="Show More Tools Menu" aria-expanded="false" aria-haspopup="true" aria-controls="header-tools-menu"> <span class="icon" aria-hidden="true" data-icon="more_horiz"></span> </button> <ul class="dropdown-content left" id="header-tools-menu" role="menu" aria-label="More Tools Menu" style="display:none;"><li role="none"> <a href="/report.cgi" role="menuitem"> <span class="icon" aria-hidden="true" data-icon="analytics"></span> <span class="label" role="none">Reports</span> </a> </li> <li role="separator"></li> <li role="none"> <a href="https://bmo.readthedocs.io/en/latest/" target="_blank" role="menuitem"> <span class="icon" aria-hidden="true" data-icon="help"></span> <span class="label" role="none">Documentation</span> </a> </li> </ul> </div> </nav> <ul id="header-login" class="links" role="none"><li id="mini_login_container_top" role="none"> <a id="login_link_top" href="/index.cgi?GoAheadAndLogIn=1" class='show_mini_login_form header-button' data-qs-suffix="_top" role="button"> <span class="icon" aria-hidden="true" data-icon="login"></span> <span class="label" role="none">Log In</span> </a> <div id="mini_login_top" class="mini-popup mini_login bz_default_hidden"> <form method="post" action="/github.cgi"> <input type="hidden" name="github_token" value="b3gVSwbwkWCxJuqBYAteAvR6MDDK89PKny6Mig5tFwoHkh9yE4Z6OB84bQHK4Rs1ZDP8vEwfogLzI7pzQFa85OhRhsPWMLOewfDTgpjmbVUulhP1QrMbZanndU2FzWNyIOtqbj0G5i1qi3om4oteXLJQyDh4zYCeU4CJ7flYGUJvMma7Ax4auMnWIyX3kesKveyJucUzzyUd8aqlgOOMEAi28RSHI4SehToLNZviJR8pOGse9sbeQGRwG4PC2QBQ"> <input type="hidden" name="target_uri" value="https://bugzilla.mozilla.org/show_bug.cgi"> <button type="submit"> <i class="fab fa-github"></i> Log In with GitHub </button> </form> <div class="method-separator">or</div> <form action="/show_bug.cgi?id=1922300" method="POST" data-qs-suffix="_top"> <input id="Bugzilla_login_top" class="bz_login" name="Bugzilla_login" title="Login" placeholder="Email" aria-label="Email" type="email" required > <input class="bz_password" id="Bugzilla_password_top" name="Bugzilla_password" type="password" title="Password" placeholder="Password" aria-label="Password" required > <input class="bz_password bz_default_hidden bz_mini_login_help" type="text" id="Bugzilla_password_dummy_top" value="password" title="Password" > <span class="remember-outer"> <input type="checkbox" id="Bugzilla_remember_top" name="Bugzilla_remember" value="on" class="bz_remember" checked> <label for="Bugzilla_remember_top">Remember me</label> </span> <input type="hidden" name="Bugzilla_login_token" value="1740559037-RcnaB_WwEdRi2hyoQYAZuM96AAwWM_1obcbX1xUCRlQ"> <input type="submit" name="GoAheadAndLogIn" value="Log In" id="log_in_top" class="check_mini_login_fields" data-qs-suffix="_top"> <a href="#" id="hide_mini_login_top" aria-label="Close" class="close-button hide_mini_login_form" data-qs-suffix="_top"> <span class="icon" aria-hidden="true"></span> </a> </form> <div class="footer"> <a href="/createaccount.cgi">Create an Account</a> · <a id="forgot_link_top" href="/index.cgi?GoAheadAndLogIn=1#forgot" class='show_forgot_form' data-qs-suffix="_top">Forgot Password</a> </div> </div> <div id="forgot_form_top" class="mini-popup mini_forgot bz_default_hidden"> <form action="/token.cgi" method="post"> <input type="email" name="loginname" size="20" placeholder="Email" aria-label="Email" required> <input id="forgot_button_top" value="Reset Password" type="submit"> <input type="hidden" name="a" value="reqpw"> <input type="hidden" id="token_top" name="token" value="1740559037-HeoB6q6fiGUpvDJnuuhiVDGHqE2b9cBZ08bLvgC5N6c"> <a href="#" class="close-button hide_forgot_form" aria-label="Close" data-qs-suffix="_top"> <span class="icon" aria-hidden="true"></span> </a> </form> </div> </li> </ul> </div> <dialog id="menu-drawer" inert aria-label="Site Menu"> <div class="drawer-inner" role="none"> <div class="header" role="none"> <button type="button" class="iconic ghost" id="close-menu-drawer" aria-label="Close Site Menu"> <span class="icon" aria-hidden="true" data-icon="close"></span> </button> </div> <ul role="menu" aria-label="Site Links"><li role="none"> <a class="header-button" href="/describecomponents.cgi" title="Browse bugs by component" role="menuitem"> <span class="icon" aria-hidden="true" data-icon="category"></span> <span class="label" role="none">Browse</span> </a> </li> <li role="none"> <a class="header-button" href="/query.cgi?format=advanced" title="Search bugs using various criteria" role="menuitem"> <span class="icon" aria-hidden="true" data-icon="pageview"></span> <span class="label" role="none">Advanced Search</span> </a> </li> <li role="none"> <a class="header-button" href="/enter_bug.cgi" title="File a new bug" role="menuitem"> <span class="icon" aria-hidden="true" data-icon="add_box"></span> <span class="label" role="none">New Bug</span> </a> </li><li role="none"> <a href="/report.cgi" role="menuitem"> <span class="icon" aria-hidden="true" data-icon="analytics"></span> <span class="label" role="none">Reports</span> </a> </li> <li role="separator"></li> <li role="none"> <a href="https://bmo.readthedocs.io/en/latest/" target="_blank" role="menuitem"> <span class="icon" aria-hidden="true" data-icon="help"></span> <span class="label" role="none">Documentation</span> </a> </li> </ul> </div> </dialog> </header> <main id="bugzilla-body" tabindex="-1"> <aside id="message-container" role="complementary"> <noscript> <div class="noscript"> <div class="inner"> <p>Please enable JavaScript in your browser to use all the features on this site.</p> </div> </div> </noscript> </aside> <div id="main-inner"> <div role="toolbar" id="page-toolbar"> <div role="group" class="buttons"> <button type="button" id="copy-summary" class="secondary separate-dropdown-button-main" title="Copy bug number and summary to your clipboard">Copy Summary</button ><div id="copy-menu-dropdown" class="dropdown"><button type="button" id="copy-menu-btn" aria-haspopup="true" aria-label="View" aria-expanded="false" aria-controls="copy-menu" class="dropdown-button secondary separate-dropdown-button-arrow" title="More options for copy">▾</button> <ul class="dropdown-content left" id="copy-menu" role="menu" style="display:none;"> <li role="presentation"> <a id="copy-markdown-summary" role="menuitem" tabindex="-1">Markdown</a> </li> <li role="presentation"> <a id="copy-markdown-bug-number" role="menuitem" tabindex="-1">Markdown (bug number)</a> </li> <li role="presentation"> <a id="copy-text-summary" role="menuitem" tabindex="-1">Plain Text</a> </li> <li role="presentation"> <a id="copy-html-summary" role="menuitem" tabindex="-1">HTML</a> </li> </ul> </div> <div id="clip-container" style="display:none"><input type="text" id="clip"></div> <div class="dropdown"> <button type="button" id="action-menu-btn" aria-haspopup="true" aria-label="View" aria-expanded="false" aria-controls="action-menu" class="dropdown-button secondary">View ▾</button> <ul class="dropdown-content left" id="action-menu" role="menu" style="display:none;"> <li role="presentation"> <a id="action-reset" role="menuitem" tabindex="-1">Reset Sections</a> </li> <li role="presentation"> <a id="action-expand-all" role="menuitem" tabindex="-1">Expand All Sections</a> </li> <li role="presentation"> <a id="action-collapse-all" role="menuitem" tabindex="-1">Collapse All Sections</a> </li> <li role="separator"></li> <li role="presentation"> <a id="action-history" role="menuitem" tabindex="-1">History</a> </li> <li role="separator"></li> <li role="presentation"> <a href="/rest/bug/1922300" role="menuitem" tabindex="-1">JSON</a> </li> <li role="presentation"> <a href="/show_bug.cgi?ctype=xml&id=1922300" role="menuitem" tabindex="-1">XML</a> </li> </ul> </div> </div> </div> <div role="status" id="io-error" style="display:none"></div> <div role="status" id="floating-message" style="display:none"> <div id="floating-message-text"></div> </div> <section class="module" > <div class="module-content" > <div id="summary-container"> <div class="field bug_modal indent" id="field-status_summary" > <div class=" container"> <span id="field-value-status_summary"> <span class="bug-status-label text" data-status="open">Open</span> <span id="field-value-bug_id"> <a href="/show_bug.cgi?id=1922300">Bug 1922300</a> </span> <span class="bug-time-labels"> <span class="bug-time-label">Opened <span class="rel-time" title="2024-10-02 07:55 PDT" data-time="1727880906">5 months ago</span></span> <span class="bug-time-label">Updated <span class="rel-time" title="2025-02-25 21:04 PST" data-time="1740546261">4 hours ago</span></span> </span> </span> </div> </div> <div class="field bug_modal indent edit-hide" > <div class=" container"> <h1 id="field-value-short_desc">Implement the view transition layer</h1> </div> </div> <div class="field bug_modal edit-show" id="field-short_desc" style="display:none" > <div class="name"> <span class="required_star edit-show" style="display:none" aria-label="Required Field">*</span> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#short_desc" id="short_desc-help-link" class="help">Summary: </a> </div> <div class="value"> <span id="field-value-short_desc"> Implement the view transition layer </span> </div> </div> </div> </div> </section> <section class="module" id="module-categories" > <header id="module-categories-header" class="module-header"> <div class="module-latch" data-label-expanded="Collapse Categories section" data-label-collapsed="Expand Categories section"> <div class="module-spinner" role="button" tabindex="0" aria-controls="module-categories-content" aria-expanded="true" aria-labeledby="module-categories-title" aria-describedby="module-categories-subtitle"></div> <h2 class="module-title" id="module-categories-title">Categories</h2> <h3 class="module-subtitle" id="module-categories-subtitle"> (Core :: CSS Parsing and Computation, task) </h3> </div> </header> <div class="module-content" id="module-categories-content" ><div class="fields-lhs"> <div class="field bug_modal" id="field-product" > <div class="name"> <a href="/describecomponents.cgi?product=Core" id="product-help-link" class="help">Product: </a> </div> <div class="value"> <span id="field-value-product"> <div class="name-info-outer dropdown"> <span id="product-name" class="dropdown-button" tabindex="0" role="button" aria-haspopup="menu" aria-controls="product-info">Core <span class="icon" aria-hidden="true">▾</span> </span> <aside id="product-info" class="name-info-popup dropdown-content right hover-display" hidden role="menu" aria-label="Product description and actions"> <header> <div class="title">Core</div> <div class="description">Shared components used by Firefox and other Mozilla software, including handling of Web content; Gecko, HTML, CSS, layout, DOM, scripts, images, networking, etc. Issues with web page layout probably go here, while Firefox user interface issues belong in the <a href="https://bugzilla.mozilla.org/describecomponents.cgi?product=Firefox">Firefox</a> product. (<a href="https://wiki.mozilla.org/Modules/All#Core">More info</a>)</div> </header> <li role="separator"></li> <div class="actions"> <div><a href="/buglist.cgi?product=Core&bug_status=__open__" target="_blank" role="menuitem" tabindex="-1">See Open Bugs in This Product</a></div> <div><a href="/enter_bug.cgi?product=Core" target="_blank" role="menuitem" tabindex="-1">File New Bug in This Product</a></div> <div><button disabled type="button" class="secondary component-watching" role="menuitem" tabindex="-1" data-product="Core" data-label-watch="Watch This Product" data-label-unwatch="Unwatch This Product" data-source="BugModal">Watch This Product</button></div> </div> </aside> </div> </span> </div> </div> <div class="field bug_modal" id="field-component" > <div class="name"> <a href="/describecomponents.cgi?product=Core&component=CSS%20Parsing%20and%20Computation#CSS%20Parsing%20and%20Computation" id="component-help-link" class="help">Component: </a> </div> <div class="value"> <span id="field-value-component"> <div class="name-info-outer dropdown"> <span id="component-name" class="dropdown-button" tabindex="0" role="button" aria-haspopup="menu" aria-controls="component-info">CSS Parsing and Computation <span class="icon" aria-hidden="true">▾</span> </span> <aside id="component-info" class="name-info-popup dropdown-content right hover-display" hidden role="menu" aria-label="Component description and actions"> <header> <div class="title">Core :: CSS Parsing and Computation</div> <div class="description"><p>Issues with loading CSS style sheets from the network, parsing style sheets and style attributes in HTML markup, performing the CSS cascade, selector matching, and producing correct computed values for CSS properties.</p> <p>Example bugs:</p> <ul> <li>toggling class name on an element does not restyle the element</li> <li>background-color property does not support hsl() values</li> </ul> <p>Specifications covered:</p> <ul> <li>CSS Cascading</li> <li>CSS Conditional</li> <li>CSS Logical Properties</li> <li>CSS Namespaces</li> <li>CSS Scoping</li> <li>CSS Style Attributes</li> <li>CSS Syntax</li> <li>CSS Values</li> <li>CSS Variables</li> <li>Media Queries</li> <li>Selectors</li> </ul></div> </header> <li role="separator"></li> <div class="actions"> <div><a href="/buglist.cgi?product=Core&component=CSS%20Parsing%20and%20Computation&bug_status=__open__" target="_blank" role="menuitem" tabindex="-1">See Open Bugs in This Component</a></div> <div><a href="/buglist.cgi?product=Core&component=CSS%20Parsing%20and%20Computation&chfield=resolution&chfieldfrom=-6m&chfieldvalue=FIXED&bug_status=__closed__" target="_blank" role="menuitem" tabindex="-1">Recently Fixed Bugs in This Component</a></div> <div><a href="/enter_bug.cgi?product=Core&component=CSS%20Parsing%20and%20Computation" target="_blank" role="menuitem" tabindex="-1">File New Bug in This Component</a></div> <div><button disabled type="button" class="secondary component-watching" role="menuitem" tabindex="-1" data-product="Core" data-component="CSS Parsing and Computation" data-label-watch="Watch This Component" data-label-unwatch="Unwatch This Component" data-source="BugModal">Watch This Component</button></div> </div> </aside> </div> </span> </div> </div> <div class="field bug_modal edit-show" id="field-version" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#version" id="version-help-link" class="help">Version: </a> </div> <div class="value"> <span id="field-value-version"> unspecified </span> </div> </div> <div class="field bug_modal edit-show" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#rep_platform" id="-help-link" class="help">Platform: </a> </div> <div class=" container"><div class="field bug_modal inline" id="field-rep_platform" > <div class="value"> <span id="field-value-rep_platform"> Unspecified </span> </div> </div><div class="field bug_modal indent inline" id="field-op_sys" > <div class="value"> <span id="field-value-op_sys"> Unspecified </span> </div> </div><div class="field bug_modal" > <div class=" container"> </div> </div> </div> </div> </div><div class="fields-rhs"> <div class="field bug_modal contains-buttons" id="field-bug_type" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#bug_type" id="bug_type-help-link" class="help">Type: </a> </div> <div class="value"> <span id="field-value-bug_type"> <span class="bug-type-label iconic-text" data-type="task"> <span class="icon" aria-hidden="true"></span>task</span> </span> </div> </div> <div class="field bug_modal" id="field-importance" > <div class=" container"> <span id="field-value-importance"><div class="field bug_modal inline" id="field-priority" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#priority" id="priority-help-link" class="help">Priority: </a> </div> <div class="value"> <span id="field-value-priority"> <em>Not set</em> </span> </div> </div><div class="field bug_modal inline" id="field-bug_severity" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#bug_severity" id="bug_severity-help-link" class="help">Severity: </a> </div> <div class="value"> <span id="field-value-bug_severity"> -- </span> </div> </div> </span> </div> </div> <div class="field bug_modal edit-show" id="field-cf_fx_points" style="display:none" > <div class="name"> Points: </div> <div class="value"> <span id="field-value-cf_fx_points"> --- </span> </div> </div> </div> </div> </section> <section class="module" id="module-tracking" > <header id="module-tracking-header" class="module-header"> <div class="module-latch" data-label-expanded="Collapse Tracking section" data-label-collapsed="Expand Tracking section"> <div class="module-spinner" role="button" tabindex="0" aria-controls="module-tracking-content" aria-expanded="true" aria-labeledby="module-tracking-title" aria-describedby="module-tracking-subtitle"></div> <h2 class="module-title" id="module-tracking-title">Tracking</h2> <h3 class="module-subtitle" id="module-tracking-subtitle"> (<span id="readable-bug-status" data-readable-bug-status="{"keywords":[],"cf_status_firefox_esr115":"---","cf_status_firefox136":"---","cf_accessibility_severity":"---","dupe_of":null,"cf_tracking_firefox_relnote":"---","cf_tracking_thunderbird_esr115":"---","cf_tracking_thunderbird_esr128":"---","cf_tracking_firefox135":"---","resolution":"","status":"ASSIGNED","cf_performance_impact":"---","cf_status_firefox135":"---","cf_webcompat_priority":"---","cf_status_firefox137":"---","cf_status_thunderbird_esr115":"---","cf_tracking_firefox_esr128":"---","cf_tracking_firefox136":"---","cf_status_thunderbird_esr128":"---","id":1922300,"cf_status_firefox_esr128":"---","target_milestone":"---","cf_tracking_firefox_esr115":"---","priority":"--","cf_a11y_review_project_flag":"---","cf_tracking_firefox137":"---","cf_webcompat_score":"---","flags":[{"name":"needinfo","status":"?"}]}"></span>) </h3> </div> </header> <div class="module-content" id="module-tracking-content" ><div class="fields-lhs"> <div class="field bug_modal edit-hide" id="field-status-view" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugStatuses" id="status-view-help-link" class="help">Status: </a> </div> <div class=" container"> <span id="field-value-status-view">ASSIGNED </span> </div> </div> <div class="field bug_modal edit-show" id="field-status-edit" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugStatuses" id="status-edit-help-link" class="help">Status: </a> </div> <div class=" container"> <span id="field-value-status-edit"><div class="field bug_modal inline" id="field-bug_status" > <div class="value"> <span id="field-value-bug_status"> ASSIGNED </span> </div> </div><div class="field bug_modal indent inline" id="field-resolution" > <div class="value"> <span id="field-value-resolution"> --- </span> </div> </div> <div id="status-action-buttons"> <div id="assigned-container" style="display:none"> <button type="button" class="secondary" id="mark-as-assigned-btn"> Mark as Assigned </button> </div> </div> </span> </div> </div> <div class="field bug_modal edit-show" id="field-target_milestone" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#target_milestone" id="target_milestone-help-link" class="help">Milestone: </a> </div> <div class="value"> <span id="field-value-target_milestone"> --- </span> </div> </div> <div class="field bug_modal edit-show" id="field-cf_fx_iteration" style="display:none" > <div class="name"> Iteration: </div> <div class="value"> <span id="field-value-cf_fx_iteration"> --- </span> </div> </div> <div class="field bug_modal edit-show" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide#Project_Flags" id="-help-link" class="help">Project Flags: </a> </div> <div class=" container"><div class="flags edit-show" style="display:none"> <table class="layout-table tracking-flags"> <tr> <td class="tracking-flag-name">Webcompat Priority</td> <td class="tracking-flag-status"><input type="hidden" id="cf_webcompat_priority-dirty"> <select id="cf_webcompat_priority" name="cf_webcompat_priority"> <option value="---" id="v4274_cf_webcompat_priority" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">Webcompat Score</td> <td class="tracking-flag-status"><input type="hidden" id="cf_webcompat_score-dirty"> <select id="cf_webcompat_score" name="cf_webcompat_score"> <option value="---" id="v6757_cf_webcompat_score" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">Performance Impact</td> <td class="tracking-flag-status"><input type="hidden" id="cf_performance_impact-dirty"> <select id="cf_performance_impact" name="cf_performance_impact"> <option value="---" id="v5427_cf_performance_impact" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">a11y-review</td> <td class="tracking-flag-status"><input type="hidden" id="cf_a11y_review_project_flag-dirty"> <select id="cf_a11y_review_project_flag" name="cf_a11y_review_project_flag"> <option value="---" id="v4876_cf_a11y_review_project_flag" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">Accessibility Severity</td> <td class="tracking-flag-status"><input type="hidden" id="cf_accessibility_severity-dirty"> <select id="cf_accessibility_severity" name="cf_accessibility_severity"> <option value="---" id="v6045_cf_accessibility_severity" selected >--- </option> </select></td> </tr> </table> </div> </div> </div> </div><div class="fields-rhs"> <div class="field tracking-flags-wrapper edit-show" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide#Tracking_Flags" id="-help-link" class="help">Tracking Flags: </a> </div> <div class=" container"><div class="flags edit-show" style="display:none"> <table class="layout-table tracking-flags"> <tr> <th></th> <th>Tracking</th> <th>Status</th> </tr> <tr> <td class="tracking-flag-name">relnote-firefox</td> <td class="tracking-flag-tracking"></td> <td class="tracking-flag-status"><input type="hidden" id="cf_tracking_firefox_relnote-dirty"> <select id="cf_tracking_firefox_relnote" name="cf_tracking_firefox_relnote"> <option value="---" id="v539_cf_tracking_firefox_relnote" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">thunderbird_esr115</td> <td class="tracking-flag-tracking"><input type="hidden" id="cf_tracking_thunderbird_esr115-dirty"> <select id="cf_tracking_thunderbird_esr115" name="cf_tracking_thunderbird_esr115"> <option value="---" id="v6094_cf_tracking_thunderbird_esr115" selected >--- </option> </select></td> <td class="tracking-flag-status"><input type="hidden" id="cf_status_thunderbird_esr115-dirty"> <select id="cf_status_thunderbird_esr115" name="cf_status_thunderbird_esr115"> <option value="---" id="v6100_cf_status_thunderbird_esr115" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">thunderbird_esr128</td> <td class="tracking-flag-tracking"><input type="hidden" id="cf_tracking_thunderbird_esr128-dirty"> <select id="cf_tracking_thunderbird_esr128" name="cf_tracking_thunderbird_esr128"> <option value="---" id="v6557_cf_tracking_thunderbird_esr128" selected >--- </option> </select></td> <td class="tracking-flag-status"><input type="hidden" id="cf_status_thunderbird_esr128-dirty"> <select id="cf_status_thunderbird_esr128" name="cf_status_thunderbird_esr128"> <option value="---" id="v6576_cf_status_thunderbird_esr128" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">firefox-esr115</td> <td class="tracking-flag-tracking"><input type="hidden" id="cf_tracking_firefox_esr115-dirty"> <select id="cf_tracking_firefox_esr115" name="cf_tracking_firefox_esr115"> <option value="---" id="v6079_cf_tracking_firefox_esr115" selected >--- </option> </select></td> <td class="tracking-flag-status"><input type="hidden" id="cf_status_firefox_esr115-dirty"> <select id="cf_status_firefox_esr115" name="cf_status_firefox_esr115"> <option value="---" id="v6084_cf_status_firefox_esr115" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">firefox-esr128</td> <td class="tracking-flag-tracking"><input type="hidden" id="cf_tracking_firefox_esr128-dirty"> <select id="cf_tracking_firefox_esr128" name="cf_tracking_firefox_esr128"> <option value="---" id="v6501_cf_tracking_firefox_esr128" selected >--- </option> </select></td> <td class="tracking-flag-status"><input type="hidden" id="cf_status_firefox_esr128-dirty"> <select id="cf_status_firefox_esr128" name="cf_status_firefox_esr128"> <option value="---" id="v6505_cf_status_firefox_esr128" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">firefox135</td> <td class="tracking-flag-tracking"><input type="hidden" id="cf_tracking_firefox135-dirty"> <select id="cf_tracking_firefox135" name="cf_tracking_firefox135"> <option value="---" id="v6816_cf_tracking_firefox135" selected >--- </option> </select></td> <td class="tracking-flag-status"><input type="hidden" id="cf_status_firefox135-dirty"> <select id="cf_status_firefox135" name="cf_status_firefox135"> <option value="---" id="v6821_cf_status_firefox135" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">firefox136</td> <td class="tracking-flag-tracking"><input type="hidden" id="cf_tracking_firefox136-dirty"> <select id="cf_tracking_firefox136" name="cf_tracking_firefox136"> <option value="---" id="v6838_cf_tracking_firefox136" selected >--- </option> </select></td> <td class="tracking-flag-status"><input type="hidden" id="cf_status_firefox136-dirty"> <select id="cf_status_firefox136" name="cf_status_firefox136"> <option value="---" id="v6843_cf_status_firefox136" selected >--- </option> </select></td> </tr> <tr> <td class="tracking-flag-name">firefox137</td> <td class="tracking-flag-tracking"><input type="hidden" id="cf_tracking_firefox137-dirty"> <select id="cf_tracking_firefox137" name="cf_tracking_firefox137"> <option value="---" id="v6869_cf_tracking_firefox137" selected >--- </option> </select></td> <td class="tracking-flag-status"><input type="hidden" id="cf_status_firefox137-dirty"> <select id="cf_status_firefox137" name="cf_status_firefox137"> <option value="---" id="v6874_cf_status_firefox137" selected >--- </option> </select></td> </tr> </table> </div> </div> </div> </div> </div> </section> <section class="module" id="module-people" > <header id="module-people-header" class="module-header"> <div class="module-latch" data-label-expanded="Collapse People section" data-label-collapsed="Expand People section"> <div class="module-spinner" role="button" tabindex="0" aria-controls="module-people-content" aria-expanded="false" aria-labeledby="module-people-title" aria-describedby="module-people-subtitle"></div> <h2 class="module-title" id="module-people-title">People</h2> <h3 class="module-subtitle" id="module-people-subtitle"> (Reporter: emilio, Assigned: emilio, NeedInfo) </h3> </div> </header> <div class="module-content" id="module-people-content" style="display:none" ><div class="fields-lhs"> <div class="field bug_modal edit-hide" id="field-assigned_to" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#assigned_to" id="assigned_to-help-link" class="help">Assignee: </a> </div> <div class="value"> <span id="field-value-assigned_to"><div class="vcard vcard_546716" ><img src="https://secure.gravatar.com/avatar/1d91d22a4892f16f744b31fd4286144e?d=mm&size=40" class="gravatar" width="20" height="20"> <a class="email " href="/user_profile?user_id=546716" > <span class="fna">emilio</span></a> </div> </span> </div> </div><div class="field bug_modal edit-show" id="field-assigned_to" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#assigned_to" id="assigned_to-help-link" class="help">Assignee: </a> </div> <div class="value"> <span id="field-value-assigned_to"> <div class="set-default-container" style="display:none"> <input type="checkbox" id="set-default-assignee" name="set_default_assignee" class="set-default" value="1" data-for="assigned_to"> <label for="set-default-assignee">Reset Assignee to default</label> </div> </span> </div> </div> <div class="field bug_modal edit-show" id="field-bug_mentors" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#bug_mentor" id="bug_mentors-help-link" class="help">Mentors: </a> </div> <div class="value"> <span id="field-value-bug_mentors">--- </span> </div> </div> <div class="field bug_modal edit-show" id="field-qa_contact" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#qa_contact" id="qa_contact-help-link" class="help">QA Contact: </a> </div> <div class="value"> <span id="field-value-qa_contact"> <div class="set-default-container" style="display:none"> <input type="checkbox" id="set-default-qa-contact" name="set_default_qa_contact" class="set-default" value="1" data-for="qa_contact"> <label for="set-default-qa-contact">Reset QA Contact to default</label> </div> </span> </div> </div> </div><div class="fields-rhs"> <div class="field bug_modal" id="field-reporter" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#reporter" id="reporter-help-link" class="help">Reporter: </a> </div> <div class="value"> <span id="field-value-reporter"> <div class="vcard vcard_546716" ><img src="https://secure.gravatar.com/avatar/1d91d22a4892f16f744b31fd4286144e?d=mm&size=40" class="gravatar" width="20" height="20"> <a class="email " href="/user_profile?user_id=546716" > <span class="fna">emilio</span></a> </div> </span> </div> </div> <div class="field bug_modal" id="field-triage_owner" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#triage_owner" id="triage_owner-help-link" class="help">Triage Owner: </a> </div> <div class="value"> <span id="field-value-triage_owner"> <div class="vcard vcard_546716" ><img src="https://secure.gravatar.com/avatar/1d91d22a4892f16f744b31fd4286144e?d=mm&size=40" class="gravatar" width="20" height="20"> <a class="email " href="/user_profile?user_id=546716" > <span class="fna">emilio</span></a> </div> </span> </div> </div> <div class="field bug_modal edit-hide" > <div class="name"> NeedInfo From: </div> <div class=" container"><div class="flags edit-hide"> <div class="flag"><div class="vcard vcard_546716" ><a class="email " href="/user_profile?user_id=546716" > <span class="fna">emilio</span></a> </div> <a href="#c4" class=" activity-ref" ><span class="rel-time" title="2025-02-25 21:04 PST" data-time="1740546261">4 hours ago</span></a> </div> </div> </div> </div><div class="field bug_modal edit-show" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#needinfo" id="-help-link" class="help">NeedInfo: </a> </div> <div class=" container"> <button type="button" id="needinfo-scroll" class="secondary">Update</button> </div> </div> <div class="field bug_modal" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#cc" id="-help-link" class="help">CC: </a> </div> <div class=" container"> <span aria-owns="cc-summary cc-latch"> <span role="button" tabindex="0" id="cc-summary" data-count="2">2 people </span> </span> <div id="cc-list" style="display:none"></div> </div> </div> </div> </div> </section> <section class="module" id="module-references" > <header id="module-references-header" class="module-header"> <div class="module-latch" data-label-expanded="Collapse References section" data-label-collapsed="Expand References section"> <div class="module-spinner" role="button" tabindex="0" aria-controls="module-references-content" aria-expanded="false" aria-labeledby="module-references-title" aria-describedby="module-references-subtitle"></div> <h2 class="module-title" id="module-references-title">References</h2> <h3 class="module-subtitle" id="module-references-subtitle"> (Blocks 2 open bugs) </h3> </div> </header> <div class="module-content" id="module-references-content" style="display:none" ><div class="fields-lhs"> <div class="field bug_modal bug-list edit-show" id="field-dependson" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#dependson" id="dependson-help-link" class="help">Depends on: </a> </div> <div class="value"> <span id="field-value-dependson"> --- </span> </div> </div><div class="field bug_modal bug-list" id="field-blocked" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#blocks" id="blocked-help-link" class="help">Blocks: </a> </div> <div class="value"> <span id="field-value-blocked"> <div class="bug-list"> <span class="bug-type-label iconic" title="enhancement" aria-label="enhancement" data-type="enhancement"> <span class="icon" aria-hidden="true"></span> </span><a class="bz_bug_link bz_status_NEW" title="NEW - [META] Implement CSS View Transitions 1" href="/show_bug.cgi?id=1823896">css-view-transitions-1</a> </div> <div class="bug-list"> <span class="bug-type-label iconic" title="task" aria-label="task" data-type="task"> <span class="icon" aria-hidden="true"></span> </span><a class="bz_bug_link bz_status_NEW" title="NEW - [META] Make live captured element rendering work" href="/show_bug.cgi?id=1922305">1922305</a> </div> </span> </div> </div><div class="field bug_modal" id="field-dependencytree" > <div class="name"> </div> <div class=" container"> <span id="field-value-dependencytree"> Dependency <a href="/showdependencytree.cgi?id=1922300&hide_resolved=1">tree</a> / <a href="/showdependencygraph.cgi?id=1922300">graph</a> </span> </div> </div> <div class="field bug_modal bug-list edit-show" id="field-regresses" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#regresses" id="regresses-help-link" class="help">Regressions: </a> </div> <div class="value"> <span id="field-value-regresses"> --- </span> </div> </div><div class="field bug_modal bug-list edit-show" id="field-regressed_by" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#regressed_by" id="regressed_by-help-link" class="help">Regressed by: </a> </div> <div class="value"> <span id="field-value-regressed_by"> --- </span> </div> </div> </div><div class="fields-rhs"> <div class="field bug_modal edit-show" id="field-bug_file_loc" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#bug_file_loc" id="bug_file_loc-help-link" class="help">URL: </a> </div> <div class="value"> <span id="field-value-bug_file_loc"><div class="link"> <a href="" target="_blank" rel="noreferrer" title="" class="bug-url" data-safe="0"></a> </div> </span> </div> </div> <div class="field bug_modal edit-show" id="field-see_also" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#see_also" id="see_also-help-link" class="help">See Also: </a> </div> <div class="value"> <span id="field-value-see_also"> --- </span> </div> </div> </div> </div> </section> <section class="module" id="module-details" > <header id="module-details-header" class="module-header"> <div class="module-latch" data-label-expanded="Collapse Details section" data-label-collapsed="Expand Details section"> <div class="module-spinner" role="button" tabindex="0" aria-controls="module-details-content" aria-expanded="false" aria-labeledby="module-details-title" aria-describedby="module-details-subtitle"></div> <h2 class="module-title" id="module-details-title">Details</h2> <h3 class="module-subtitle" id="module-details-subtitle"> (Whiteboard: [viewtransitions:m1]) </h3> </div> </header> <div class="module-content" id="module-details-content" style="display:none" ><div class="fields-lhs"> <div class="field bug_modal edit-show" id="field-alias" style="display:none" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#alias" id="alias-help-link" class="help">Alias: </a> </div> <div class="value"> <span id="field-value-alias"> --- </span> </div> </div> <div class="field bug_modal edit-show" id="field-keywords" style="display:none" > <div class="name"> <a href="/describekeywords.cgi" id="keywords-help-link" class="help">Keywords: </a> </div> <div class="value"> <span id="field-value-keywords">--- </span> </div> </div> <div class="field bug_modal" id="field-status_whiteboard" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/Whiteboard" id="status_whiteboard-help-link" class="help">Whiteboard: </a> </div> <div class="value"> <span id="field-value-status_whiteboard">[viewtransitions:m1] </span> </div> </div><div class="field bug_modal edit-show" id="field-cf_qa_whiteboard" style="display:none" > <div class="name"> QA Whiteboard: </div> <div class="value"> <span id="field-value-cf_qa_whiteboard"> --- </span> </div> </div> <div class="field bug_modal edit-show" id="field-cf_has_str" style="display:none" > <div class="name"> Has STR: </div> <div class="value"> <span id="field-value-cf_has_str"> --- </span> </div> </div><div class="field bug_modal edit-show" id="field-cf_cab_review" style="display:none" > <div class="name"> Change Request: </div> <div class="value"> <span id="field-value-cf_cab_review"> --- </span> </div> </div> <div class="field bug_modal" id="field-votes" > <div class="name"> <a href="https://wiki.mozilla.org/BMO/UserGuide/BugFields#votes" id="votes-help-link" class="help">Votes: </a> </div> <div class=" container"> <span id="field-value-votes">0 </span> </div> </div> </div><div class="fields-rhs"> <div class="field bug_modal edit-show" id="field-bug_flags" style="display:none" > <div class="name"> Bug Flags: </div> <div class=" container"> <span id="field-value-bug_flags"><div id="bug-flags" class="flags"> <table class="layout-table"> <tbody class="edit-show" style="display:none"><tr> <td class="flag-setter"> </td> <td class="flag-name"> <label title="Is this bug/feature enabled in a release by a pref flag?" for="flag_type-930">behind-pref</label> </td> <td class="flag-value"> <input type="hidden" id="flag_type-930-dirty"> <select id="flag_type-930" name="flag_type-930" title="Is this bug/feature enabled in a release by a pref flag?" disabled class="bug-flag"> <option value="X"></option> </select> </td> </tr><tr> <td class="flag-setter"> </td> <td class="flag-name"> <label title="Flag tracking inclusion in the desktop Firefox product backlog." for="flag_type-846">firefox-backlog</label> </td> <td class="flag-value"> <input type="hidden" id="flag_type-846-dirty"> <select id="flag_type-846" name="flag_type-846" title="Flag tracking inclusion in the desktop Firefox product backlog." disabled class="bug-flag"> <option value="X"></option> </select> </td> </tr><tr> <td class="flag-setter"> </td> <td class="flag-name"> <label title="Flag is used to track security bug bounty nominations. Mail security(at)mozilla.org to nominate a bug." for="flag_type-803">sec-bounty</label> </td> <td class="flag-value"> <input type="hidden" id="flag_type-803-dirty"> <select id="flag_type-803" name="flag_type-803" title="Flag is used to track security bug bounty nominations. Mail security(at)mozilla.org to nominate a bug." class="bug-flag"> <option value="X"></option> <option value="?" >?</option> </select> </td> </tr><tr> <td class="flag-setter"> </td> <td class="flag-name"> <label title="Flag is used to track whether the bug report is eligible for inclusion in the Bug Bounty Hall of Fame." for="flag_type-913">sec-bounty-hof</label> </td> <td class="flag-value"> <input type="hidden" id="flag_type-913-dirty"> <select id="flag_type-913" name="flag_type-913" title="Flag is used to track whether the bug report is eligible for inclusion in the Bug Bounty Hall of Fame." disabled class="bug-flag"> <option value="X"></option> </select> </td> </tr><tr> <td class="flag-setter"> </td> <td class="flag-name"> <label title="Whether the bug has a testcase in the qa test suite or not. Set it to "in-qa-testsuite?" if the bug needs a testcase (only set this if the bug actually *needs* a testcase - not all bugs do, even layout bugs!), set it to "in-qa-testsuite+" if the bug has an appropriate testcase, and set it to "in-qa-testsuite-" if the bug doesn't need an explicit testcase (e.g. for code cleanup bugs). Only QA actively working on test cases in the component should use this keyword." for="flag_type-787">in-qa-testsuite</label> </td> <td class="flag-value"> <input type="hidden" id="flag_type-787-dirty"> <select id="flag_type-787" name="flag_type-787" title="Whether the bug has a testcase in the qa test suite or not. Set it to "in-qa-testsuite?" if the bug needs a testcase (only set this if the bug actually *needs* a testcase - not all bugs do, even layout bugs!), set it to "in-qa-testsuite+" if the bug has an appropriate testcase, and set it to "in-qa-testsuite-" if the bug doesn't need an explicit testcase (e.g. for code cleanup bugs). Only QA actively working on test cases in the component should use this keyword." disabled class="bug-flag"> <option value="X"></option> </select> </td> <td class="flag-requestee"> <div id="requestee_type-787-container" style="display:none"><input name="requestee_type-787" value="" class="requestee bz_autocomplete_user" id="requestee_type-787" > </div> <td> </tr><tr> <td class="flag-setter"> </td> <td class="flag-name"> <label title="Whether the bug has a testcase in the test suite or not. Set it to "in-testsuite?" if the bug needs a testcase (only set this if the bug actually *needs* a testcase - not all bugs do, even layout bugs!), set it to "in-testsuite+" if the bug has an appropriate testcase, and set it to "in-testsuite-" if the bug doesn't need an explicit testcase (e.g. for code cleanup bugs). Only QA actively working on test cases in the component should use this keyword." for="flag_type-37">in-testsuite</label> </td> <td class="flag-value"> <input type="hidden" id="flag_type-37-dirty"> <select id="flag_type-37" name="flag_type-37" title="Whether the bug has a testcase in the test suite or not. Set it to "in-testsuite?" if the bug needs a testcase (only set this if the bug actually *needs* a testcase - not all bugs do, even layout bugs!), set it to "in-testsuite+" if the bug has an appropriate testcase, and set it to "in-testsuite-" if the bug doesn't need an explicit testcase (e.g. for code cleanup bugs). Only QA actively working on test cases in the component should use this keyword." disabled class="bug-flag"> <option value="X"></option> </select> </td> </tr><tr> <td class="flag-setter"> </td> <td class="flag-name"> <label title="qe-verify: + ➜ request to verify the bug manually qe-verify: – ➜ the bug will not/can not be verified manually" for="flag_type-864">qe-verify</label> </td> <td class="flag-value"> <input type="hidden" id="flag_type-864-dirty"> <select id="flag_type-864" name="flag_type-864" title="qe-verify: + ➜ request to verify the bug manually qe-verify: – ➜ the bug will not/can not be verified manually" disabled class="bug-flag"> <option value="X"></option> </select> </td> </tr> </tbody> </table> </div> </span> </div> </div> </div> </div> </section> <section class="module edit-show" style="display:none" id="module-crash-data" > <header id="module-crash-data-header" class="module-header"> <div class="module-latch" data-label-expanded="Collapse Crash Data section" data-label-collapsed="Expand Crash Data section"> <div class="module-spinner" role="button" tabindex="0" aria-controls="module-crash-data-content" aria-expanded="false" aria-labeledby="module-crash-data-title" aria-describedby="module-crash-data-subtitle"></div> <h2 class="module-title" id="module-crash-data-title">Crash Data</h2> </div> </header> <div class="module-content" id="module-crash-data-content" style="display:none" ><div class="field bug_modal edit-show" id="field-cf_crash_signature" style="display:none" > <div class="name"> Signature: </div> <div class="value"> <span id="field-value-cf_crash_signature"> <em>None</em> </span> </div> </div> </div> </section> <section class="module edit-show" style="display:none" id="module-security" > <header id="module-security-header" class="module-header"> <div class="module-latch" data-label-expanded="Collapse Security section" data-label-collapsed="Expand Security section"> <div class="module-spinner" role="button" tabindex="0" aria-controls="module-security-content" aria-expanded="false" aria-labeledby="module-security-title" aria-describedby="module-security-subtitle"></div> <h2 class="module-title" id="module-security-title">Security</h2> <h3 class="module-subtitle" id="module-security-subtitle"> (public) </h3> </div> </header> <div class="module-content" id="module-security-content" style="display:none" ><div class="groups edit-hide"> This bug is publicly visible. </div> <div class="groups edit-show" style="display:none"> </div> </div> </section> <section class="module edit-show" style="display:none" id="module-user-story" data-non-stick="1" > <header id="module-user-story-header" class="module-header"> <div class="module-latch" data-label-expanded="Collapse User Story section" data-label-collapsed="Expand User Story section"> <div class="module-spinner" role="button" tabindex="0" aria-controls="module-user-story-content" aria-expanded="false" aria-labeledby="module-user-story-title" aria-describedby="module-user-story-subtitle"></div> <h2 class="module-title" id="module-user-story-title">User Story</h2> </div> </header> <div class="module-content" id="module-user-story-content" style="display:none" > <pre id="user-story"></pre> </div> </section> <section class="module" id="module-attachments" > <header id="module-attachments-header" class="module-header"> <div class="module-latch" data-label-expanded="Collapse Attachments section" data-label-collapsed="Expand Attachments section"> <div class="module-spinner" role="button" tabindex="0" aria-controls="module-attachments-content" aria-expanded="true" aria-labeledby="module-attachments-title" aria-describedby="module-attachments-subtitle"></div> <h2 class="module-title" id="module-attachments-title">Attachments</h2> <h3 class="module-subtitle" id="module-attachments-subtitle"> (1 file) </h3> </div> </header> <div class="module-content" id="module-attachments-content" ><table role="table" class="responsive" id="attachments"> <tr data-attachment-id="9468069" class=" attach-patch " > <td class="attach-desc-td"> <div class="attach-desc"> <a href="/attachment.cgi?id=9468069" > Bug 1922300 - View display list transition pseudo-tree in a pseudo-top layer. r=#vt </a> </div> <div> <a href="#c1" class="attach-time activity-ref"><span class="rel-time" title="2025-02-24 10:35 PST" data-time="1740422153">2 days ago</span></a> <span class="attach-author"><div class="vcard vcard_546716" ><a class="email " href="/user_profile?user_id=546716" > <span class="fna">Emilio Cobos Álvarez (:emilio)</span></a> </div></span> </div> <div class="attach-info">48 bytes, text/x-phabricator-request </div> </td> <td></td> <td class="attach-actions"> <a href="/attachment.cgi?id=9468069&action=edit" data-details="1">Details</a>  | <a href="/attachment.cgi?id=9468069">Review</a> </tr> </table> <footer id="attachments-footer"> <div id="attachments-actions"> </div> </footer> </div> </section> <script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc"> init_module_visibility(); </script> <meta name="firefox-versions" content="{"FIREFOX_AURORA":"","FIREFOX_DEVEDITION":"136.0b9","FIREFOX_ESR":"128.7.0esr","FIREFOX_ESR115":"115.20.0esr","FIREFOX_ESR_NEXT":"","FIREFOX_NIGHTLY":"137.0a1","LAST_MERGE_DATE":"2025-02-03","LAST_RELEASE_DATE":"2025-02-04","LAST_SOFTFREEZE_DATE":"2025-01-30","LAST_STRINGFREEZE_DATE":"2025-01-31","LATEST_FIREFOX_DEVEL_VERSION":"136.0b9","LATEST_FIREFOX_OLDER_VERSION":"3.6.28","LATEST_FIREFOX_RELEASED_DEVEL_VERSION":"136.0b9","LATEST_FIREFOX_VERSION":"135.0.1","NEXT_MERGE_DATE":"2025-03-03","NEXT_RELEASE_DATE":"2025-03-04","NEXT_SOFTFREEZE_DATE":"2025-02-27","NEXT_STRINGFREEZE_DATE":"2025-02-28"}"> <div id="comment-actions"> <button type="button" id="bottom-btn" class="secondary" aria-label="Go to Page Bottom">Bottom ↓</button> <div class="dropdown"> <button type="button" id="comment-tags-btn" aria-haspopup="true" aria-label="Tags" aria-expanded="false" aria-controls="comment-tags-menu" class="dropdown-button minor">Tags ▾</button> <ul id="comment-tags-menu" role="menu" tabindex="0" class="dropdown-content left" style="display:none"> <li role="presentation"> <a role="menuitem" tabindex="-1" data-comment-tag="">Reset</a> </li> </ul> </div> <div class="dropdown"> <button type="button" id="view-menu-btn" aria-haspopup="true" aria-label="Timeline" aria-expanded="false" aria-controls="view-menu" class="dropdown-button minor">Timeline ▾</button> <ul id="view-menu" role="menu" tabindex="0" class="dropdown-content left" style="display:none"> <li role="presentation"> <a id="view-reset" role="menuitem" tabindex="-1">Reset</a> </li> <li role="separator"></li> <li role="presentation"> <a id="view-collapse-all" role="menuitem" tabindex="-1">Collapse All</a> </li> <li role="presentation"> <a id="view-expand-all" role="menuitem" tabindex="-1">Expand All</a> </li> <li role="presentation"> <a id="view-comments-only" role="menuitem" tabindex="-1">Comments Only</a> </li> </ul> </div> </div> <div class="change-set" id="c0"><div class="comment" data-id="17140712" data-no="0" data-tags=""> <table class="layout-table change-head assignee" id="ch-0" role="presentation"> <tr> <td rowspan="2" class="change-gravatar"><div class="vcard vcard_546716" ><img src="https://secure.gravatar.com/avatar/1d91d22a4892f16f744b31fd4286144e?d=mm&size=64" class="gravatar" width="32" height="32"> </div> </td> <td class="change-author"><div class="vcard vcard_546716" ><a class="email " href="/user_profile?user_id=546716" > <span class="fna">Emilio Cobos Álvarez (:emilio)</span></a> </div> <span class="user-role">Assignee</span> </td> <td rowspan="2" class="comment-actions"><div role="group"> <button type="button" class="change-spinner ghost iconic" id="cs-0" aria-label="Collapse" aria-expanded="true" data-strings='{ "collapse_label": "Collapse", "expand_label": "Expanded" }'> <span class="icon" aria-hidden="true"></span> </button> </div></td> </tr> <tr id="cr-0" > <td> <h3 class="change-name"> <a href="/show_bug.cgi?id=1922300#c0">Description</a> </h3> • <div class="change-time"><span class="rel-time" title="2024-10-02 07:55 PDT" data-time="1727880906">5 months ago</span> </div> </td> </tr> <tr id="ctag-0"> <td colspan="2" class="comment-tags"> </td> </tr> </table> </div><div class="comment-text markdown-body " id="ct-0" data-comment-id="17140712"><p><a href="https://drafts.csswg.org/css-view-transitions-1/#view-transition-layer" rel="nofollow">https://drafts.csswg.org/css-view-transitions-1/#view-transition-layer</a>:</p> <ul> <li>Implementation should be very similar to the current top layer implementation.</li> <li>Might need extending -moz-top-layer (but hopefully not)</li> <li>It creates a CB for fixed-pos and abspos, which means stuff can't escape from it.</li> </ul> </div></div><div class="change-set" id="a433883_458208"><div class="change" id="aa433883_458208"> <table class="layout-table change-head " role="presentation"> <tr> <td rowspan="2" class="change-gravatar"><div class="vcard vcard_458208" id="a433883_458208"><img src="https://secure.gravatar.com/avatar/77b9a64a0b7dedcdc291ede3655d202d?d=mm&size=64" class="gravatar" width="32" height="32"> </div> </td> <td class="change-author"><div class="vcard vcard_458208" id="a433883_458208"><a class="email " href="/user_profile?user_id=458208" > <span class="fna">Marco Mucci [:MarcoM]</span></a> </div> </td> <td rowspan="2" class="comment-actions"><div role="group"> <button type="button" class="change-spinner ghost iconic" id="as-a433883_458208" aria-label="Collapse" aria-expanded="true" data-strings='{ "collapse_label": "Collapse", "expand_label": "Expanded" }'> <span class="icon" aria-hidden="true"></span> </button> </div></td> </tr> <tr id="ar-a433883_458208"> <td> <h3 class="change-name"> <a href="/show_bug.cgi?id=1922300#a433883_458208">Updated</a> </h3> • <div class="change-time"><span class="rel-time" title="2024-10-07 08:26 PDT" data-time="1728314789">5 months ago</span> </div> </td> </tr> </table> </div><div class="activity"><div class="change">Whiteboard: [viewtransitions:m1]</div></div></div><div class="change-set" id="a683251_546716"><div class="change" id="aa683251_546716"> <table class="layout-table change-head assignee" role="presentation"> <tr> <td rowspan="2" class="change-gravatar"><div class="vcard vcard_546716" id="a683251_546716"><img src="https://secure.gravatar.com/avatar/1d91d22a4892f16f744b31fd4286144e?d=mm&size=64" class="gravatar" width="32" height="32"> </div> </td> <td class="change-author"><div class="vcard vcard_546716" id="a683251_546716"><a class="email " href="/user_profile?user_id=546716" > <span class="fna">Emilio Cobos Álvarez (:emilio)</span></a> </div> <span class="user-role">Assignee</span> </td> <td rowspan="2" class="comment-actions"><div role="group"> <button type="button" class="change-spinner ghost iconic" id="as-a683251_546716" aria-label="Collapse" aria-expanded="true" data-strings='{ "collapse_label": "Collapse", "expand_label": "Expanded" }'> <span class="icon" aria-hidden="true"></span> </button> </div></td> </tr> <tr id="ar-a683251_546716"> <td> <h3 class="change-name"> <a href="/show_bug.cgi?id=1922300#a683251_546716">Updated</a> </h3> • <div class="change-time"><span class="rel-time" title="2024-10-10 05:42 PDT" data-time="1728564157">5 months ago</span> </div> </td> </tr> </table> </div><div class="activity"><div class="change">Blocks: <a class="bz_bug_link bz_status_NEW" title="NEW - [META] Make live captured element rendering work" href="/show_bug.cgi?id=1922305">1922305</a></div></div></div><div class="change-set" id="c1"><div class="comment" data-id="17365097" data-no="1" data-tags=""> <table class="layout-table change-head assignee" id="ch-1" role="presentation"> <tr> <td rowspan="2" class="change-gravatar"><div class="vcard vcard_546716" id="a683251_546716"><img src="https://secure.gravatar.com/avatar/1d91d22a4892f16f744b31fd4286144e?d=mm&size=64" class="gravatar" width="32" height="32"> </div> </td> <td class="change-author"><div class="vcard vcard_546716" id="a683251_546716"><a class="email " href="/user_profile?user_id=546716" > <span class="fna">Emilio Cobos Álvarez (:emilio)</span></a> </div> <span class="user-role">Assignee</span> </td> <td rowspan="2" class="comment-actions"><div role="group"> <button type="button" class="change-spinner ghost iconic" id="cs-1" aria-label="Collapse" aria-expanded="true" data-strings='{ "collapse_label": "Collapse", "expand_label": "Expanded" }'> <span class="icon" aria-hidden="true"></span> </button> </div></td> </tr> <tr id="cr-1" > <td> <h3 class="change-name"> <a href="/show_bug.cgi?id=1922300#c1">Comment 1</a> </h3> • <div class="change-time"><span class="rel-time" title="2025-02-24 10:35 PST" data-time="1740422153">2 days ago</span> </div> </td> </tr> <tr id="ctag-1"> <td colspan="2" class="comment-tags"> </td> </tr> </table> </div><div id="att-9468069" class="attachment" data-id="9468069" itemscope itemtype="http://schema.org/MediaObject"> <meta itemprop="name" content="phabricator-D239378-url.txt"> <meta itemprop="contentSize" content="48"> <meta itemprop="encodingFormat" content="text/x-phabricator-request"> <div class="label"> Attached file <a class="link" href="attachment.cgi?id=9468069" itemprop="contentUrl" > <span id="att-9468069-description" itemprop="description">Bug 1922300 - View display list transition pseudo-tree in a pseudo-top layer. r=#vt</span></a> — <a href="attachment.cgi?id=9468069&action=edit" itemprop="url" data-details="1">Details</a> </div> </div> <div class="comment-text markdown-body " id="ct-1" data-comment-id="17365097"><p>On top of the regular top layer but under DevTools and other UA content.</p> </div></div><div class="change-set" id="a12541247_600971"><div class="change" id="aa12541247_600971"> <table class="layout-table change-head " role="presentation"> <tr> <td rowspan="2" class="change-gravatar"><div class="vcard vcard_600971" id="a12541247_600971"><img src="https://secure.gravatar.com/avatar/a088418052679d9583556d277e6774ee?d=mm&size=64" class="gravatar" width="32" height="32"> </div> </td> <td class="change-author"><div class="vcard vcard_600971" id="a12541247_600971"><a class="email " href="/user_profile?user_id=600971" > <span class="fna">Phabricator Automation</span></a> </div> </td> <td rowspan="2" class="comment-actions"><div role="group"> <button type="button" class="change-spinner ghost iconic" id="as-a12541247_600971" aria-label="Collapse" aria-expanded="true" data-strings='{ "collapse_label": "Collapse", "expand_label": "Expanded" }'> <span class="icon" aria-hidden="true"></span> </button> </div></td> </tr> <tr id="ar-a12541247_600971"> <td> <h3 class="change-name"> <a href="/show_bug.cgi?id=1922300#a12541247_600971">Updated</a> </h3> • <div class="change-time"><span class="rel-time" title="2025-02-24 10:35 PST" data-time="1740422153">2 days ago</span> </div> </td> </tr> </table> </div><div class="activity"><div class="change">Assignee: nobody → emilio</div><div class="change">Status: NEW → ASSIGNED</div></div></div><div class="change-set" id="c2"><div class="comment" data-id="17367438" data-no="2" data-tags=""> <table class="layout-table change-head " id="ch-2" role="presentation"> <tr> <td rowspan="2" class="change-gravatar"><div class="vcard vcard_510726" id="a12541247_600971"><img src="https://secure.gravatar.com/avatar/a9d6ca739b340c670a0fecbd2c36f516?d=mm&size=64" class="gravatar" width="32" height="32"> </div> </td> <td class="change-author"><div class="vcard vcard_510726" id="a12541247_600971"><a class="email " href="/user_profile?user_id=510726" > <span class="fna">Pulsebot</span></a> </div> </td> <td rowspan="2" class="comment-actions"><div role="group"> <button type="button" class="change-spinner ghost iconic" id="cs-2" aria-label="Collapse" aria-expanded="true" data-strings='{ "collapse_label": "Collapse", "expand_label": "Expanded" }'> <span class="icon" aria-hidden="true"></span> </button> </div></td> </tr> <tr id="cr-2" > <td> <h3 class="change-name"> <a href="/show_bug.cgi?id=1922300#c2">Comment 2</a> </h3> • <div class="change-time"><span class="rel-time" title="2025-02-25 17:50 PST" data-time="1740534621">7 hours ago</span> </div> </td> </tr> <tr id="ctag-2"> <td colspan="2" class="comment-tags"> </td> </tr> </table> </div><div class="comment-text " id="ct-2" data-comment-id="17367438">Pushed by <a href="mailto:ealvarez@mozilla.com">ealvarez@mozilla.com</a>: <a rel="nofollow" href="https://hg.mozilla.org/integration/autoland/rev/ba3d9d95cd56">https://hg.mozilla.org/integration/autoland/rev/ba3d9d95cd56</a> View display list transition pseudo-tree in a pseudo-top layer. r=view-transitions-reviewers,boris</div></div><div class="change-set" id="c3"><div class="comment" data-id="17367513" data-no="3" data-tags=""> <table class="layout-table change-head " id="ch-3" role="presentation"> <tr> <td rowspan="2" class="change-gravatar"><div class="vcard vcard_510726" id="a12541247_600971"><img src="https://secure.gravatar.com/avatar/a9d6ca739b340c670a0fecbd2c36f516?d=mm&size=64" class="gravatar" width="32" height="32"> </div> </td> <td class="change-author"><div class="vcard vcard_510726" id="a12541247_600971"><a class="email " href="/user_profile?user_id=510726" > <span class="fna">Pulsebot</span></a> </div> </td> <td rowspan="2" class="comment-actions"><div role="group"> <button type="button" class="change-spinner ghost iconic" id="cs-3" aria-label="Collapse" aria-expanded="true" data-strings='{ "collapse_label": "Collapse", "expand_label": "Expanded" }'> <span class="icon" aria-hidden="true"></span> </button> </div></td> </tr> <tr id="cr-3" > <td> <h3 class="change-name"> <a href="/show_bug.cgi?id=1922300#c3">Comment 3</a> </h3> • <div class="change-time"><span class="rel-time" title="2025-02-25 20:54 PST" data-time="1740545689">4 hours ago</span> </div> </td> </tr> <tr id="ctag-3"> <td colspan="2" class="comment-tags"> </td> </tr> </table> </div><div class="comment-text " id="ct-3" data-comment-id="17367513">Backout by <a href="mailto:chorotan@mozilla.com">chorotan@mozilla.com</a>: <a rel="nofollow" href="https://hg.mozilla.org/integration/autoland/rev/547865ab1adb">https://hg.mozilla.org/integration/autoland/rev/547865ab1adb</a> Backed out 9 changesets (<a class="bz_bug_link bz_status_ASSIGNED" title="ASSIGNED - Implement the view transition layer" href="/show_bug.cgi?id=1922300">bug 1922300</a>, <a class="bz_bug_link bz_status_NEW" title="NEW - Fix transition-in-hidden-page.html" href="/show_bug.cgi?id=1950362">bug 1950362</a>, <a class="bz_bug_link bz_status_ASSIGNED" title="ASSIGNED - Implement right inheritance in view transitions pseudo-elements" href="/show_bug.cgi?id=1919333">bug 1919333</a>, <a class="bz_bug_link bz_status_NEW" title="NEW - Add a debugging pref to keep view transitions active." href="/show_bug.cgi?id=1950176">bug 1950176</a>, <a class="bz_bug_link bz_status_NEW" title="NEW - Implement dynamic keyframe UA rules" href="/show_bug.cgi?id=1948058">bug 1948058</a>, <a class="bz_bug_link bz_status_NEW" title="NEW - Pass snapshot via stacking context params" href="/show_bug.cgi?id=1950177">bug 1950177</a>, <a class="bz_bug_link bz_status_ASSIGNED" title="ASSIGNED - Implement the rule that elements with non-none view-transition-name become a stacking context." href="/show_bug.cgi?id=1922298">bug 1922298</a>) for causing multiple Wr failures</div></div><div class="change-set" id="c4"><div class="comment" data-id="17367517" data-no="4" data-tags=""> <table class="layout-table change-head " id="ch-4" role="presentation"> <tr> <td rowspan="2" class="change-gravatar"><div class="vcard vcard_721399" id="a12541247_600971"><img src="https://secure.gravatar.com/avatar/21fad92f0d1418d9779fdcc2671c549c?d=mm&size=64" class="gravatar" width="32" height="32"> </div> </td> <td class="change-author"><div class="vcard vcard_721399" id="a12541247_600971"><a class="email " href="/user_profile?user_id=721399" > <span class="fna">Cristina Horotan [:chorotan]</span></a> </div> </td> <td rowspan="2" class="comment-actions"><div role="group"> <button type="button" class="change-spinner ghost iconic" id="cs-4" aria-label="Collapse" aria-expanded="true" data-strings='{ "collapse_label": "Collapse", "expand_label": "Expanded" }'> <span class="icon" aria-hidden="true"></span> </button> </div></td> </tr> <tr id="cr-4" > <td> <h3 class="change-name"> <a href="/show_bug.cgi?id=1922300#c4">Comment 4</a> </h3> • <div class="change-time"><span class="rel-time" title="2025-02-25 21:04 PST" data-time="1740546261">4 hours ago</span> </div> </td> </tr> <tr id="ctag-4"> <td colspan="2" class="comment-tags"> </td> </tr> </table> </div><div class="comment-text markdown-body " id="ct-4" data-comment-id="17367517"><p>Backed out Wr failures</p> <p><a href="https://hg.mozilla.org/integration/autoland/rev/547865ab1adba207471c19ab7272e8c77a23cfdc" rel="nofollow">Backout link</a></p> <p><a href="https://treeherder.mozilla.org/jobs?repo=autoland&group_state=expanded&revision=54c87e09251ac223157610093b07e76b784dde20&searchStr=wr" rel="nofollow">Push with failures</a></p> <p>[Failure logs]<br> <a href="https://treeherder.mozilla.org/logviewer?job_id=496615862&repo=autoland&lineNumber=3827" rel="nofollow">https://treeherder.mozilla.org/logviewer?job_id=496615862&repo=autoland&lineNumber=3827</a><br> <a href="https://treeherder.mozilla.org/logviewer?job_id=496613792&repo=autoland&lineNumber=3916" rel="nofollow">https://treeherder.mozilla.org/logviewer?job_id=496613792&repo=autoland&lineNumber=3916</a><br> <a href="https://treeherder.mozilla.org/logviewer?job_id=496617459&repo=autoland&lineNumber=13593" rel="nofollow">https://treeherder.mozilla.org/logviewer?job_id=496617459&repo=autoland&lineNumber=13593</a></p> </div><div class="activity"><div class="change">Flags: needinfo?(emilio)</div></div></div><div id="new-comment-notice"> You need to <a href="/show_bug.cgi?id=1922300&GoAheadAndLogIn=1">log in</a> before you can comment on or make changes to this bug. </div> <div id="bottom-actions"> <div id="bottom-right-actions"> <button type="button" id="top-btn" class="secondary" aria-label="Go to Page Top">Top ↑</button> </div> </div> <dialog id="att-overlay" class="readonly" aria-labelledby="att-overlay-title" data-attachment-count="1"> <form method="dialog"> <div class="header"> <h2 id="att-overlay-title" class="title">Attachment</h2> <div class="spacer"></div> <button type="button" class="secondary iconic" hidden disabled data-action="prev" title="Previous Attachment" aria-keyshortcuts="ArrowLeft"> <span class="icon" aria-hidden="true"></span> </button> <button type="button" class="secondary iconic" hidden disabled data-action="next" title="Next Attachment" aria-keyshortcuts="ArrowRight"> <span class="icon" aria-hidden="true"></span> </button> <button type="button" class="secondary" data-action="toggle-details">Hide Details</button> <button type="button" class="secondary iconic" data-action="close" aria-label="Close"> <span class="icon" aria-hidden="true"></span> </button> </div> <div class="body"> <div class="sub-column"> <div class="detail-pane"> <section class="cols"> <h3>General</h3> <div class="creator"> Creator: <div class="vcard vcard_546716" ><a class="email " href="/user_profile?user_id=546716" > <span class="fna">Emilio Cobos Álvarez (:emilio)</span></a> </div> </div> <div>Created: <span class="created-date rel-time"></span></div> <div>Updated: <span class="updated-date rel-time"></span></div> <div>Size: <span class="file-size"></span></div> </section> <section class="cols"> <h3> <label for="att-overlay-description">Description</label> </h3> <div> <input type="text" name="description" disabled id="att-overlay-description" class="flex"> </div> </section> <section class="cols"> <h3> <label for="att-overlay-file-name">File Name</label> </h3> <div> <input type="text" name="filename" disabled id="att-overlay-file-name" class="flex"> </div> </section> <section class="cols"> <h3> <label for="att-overlay-content-type">Content Type</label> </h3> <div> <input type="text" name="contenttypeentry" disabled id="att-overlay-content-type" class="flex"> </div> </section> </div> </div> <div class="main-column"> <div class="preview-pane"> <div class="preview "> </div> </div> </div> </div> <div class="footer"> <button type="button" class="secondary" data-action="raw">Raw</button> <button type="button" class="secondary" disabled data-action="diff">Diff</button> <button type="button" class="secondary" disabled data-action="review" data-base="https://bugzilla.mozilla.org/page.cgi?id=splinter.html&ignore=">Splinter Review</button> <div class="spacer"></div> </div> </form> </dialog> <link rel="stylesheet" href="/static/v20250219.1/extensions/FlagTypeComment/web/styles/ftc.css"> <script nonce="Lxb4s6k9b28uTJYHUl2MsscEUqyQxnR6naFOfKNwK1NzArpc" src="/static/v20250219.1/extensions/FlagTypeComment/web/js/ftc.js"></script></div> </main> </div> </body> </html>

CINXE.COM

1922300 - Implement the view transition layer