rooty/Bootstrap
0
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2024-12-02 14:24:19 +01:00
Code Issues Actions Packages Releases Activity
0a5f6e078c
Bootstrap/js/tests/visual/modal.html

276 lines
15 KiB
HTML
Raw Normal View History

Switch to lowercase `doctype`. (#24217) Having it uppercase doesn't offer anything and the lowercase version slightly improves gzip compression.
2017-10-03 18:34:59 +02:00
<!doctype html>
Tighten htmllint's rules. (#24471)
2017-10-22 14:02:24 +02:00
<html lang="en">
Update visual tests.
2016-11-12 16:12:58 +01:00
<head>
<meta charset="utf-8">
Remove the now unneeded `shrink-to-fit` directive. (#28314)
2019-02-27 16:47:41 +01:00
<meta name="viewport" content="width=device-width, initial-scale=1">
Move `href` attribute first (#31835)
2020-10-22 08:38:15 +02:00
<link href="../../../dist/css/bootstrap.min.css" rel="stylesheet">
Update visual tests.
2016-11-12 16:12:58 +01:00
<title>Modal</title>
<style>
#tall {
height: 1500px;
width: 100px;
}
</style>
</head>
<body>
update navbars to rename .navbar-inverse to .navbar-dark, update all navbar examples and variables
2017-06-26 03:29:43 +02:00
<nav class="navbar navbar-full navbar-dark bg-dark">
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<button class="navbar-toggler hidden-lg-up" type="button" data-bs-toggle="collapse" data-bs-target="#navbarResponsive" aria-controls="navbarResponsive" aria-expanded="false" aria-label="Toggle navigation"></button>
rename from .navbar-toggleable to .navbar-expand to reflect mobile first approach everywhere else
2017-03-22 06:00:46 +01:00
<div class="collapse navbar-expand-md" id="navbarResponsive">
Update visual tests.
2016-11-12 16:12:58 +01:00
<a class="navbar-brand" href="#">This shouldn't jump!</a>
Update nav and navbar HTML markup According to the docs, you just need to apply the `navbar-nav` to an `<ul>` tag in a list-based navbar. In fact, `navbar-nav` seems to override all the css properties set by `nav`. Also, `nav-item` class should be used only for `<li>` tags, or in conjunction with `<a>` tags to entirely avoid the list-based approach. This commit removes the redundant `nav` class from `navbar-nav` `<ul>` tags, moves `nav-item` from `<a>` tags to `<li>` tags and properly adds `nav-item` class to `<li>` tags where missing. Refs: * https://v4-alpha.getbootstrap.com/components/navs/ * https://v4-alpha.getbootstrap.com/components/navbar/#nav
2017-04-12 16:06:52 +02:00
<ul class="navbar-nav">
Move "active" class from `.nav-item` to `.nav-link` (#32730)
2021-01-08 19:53:04 +01:00
<li class="nav-item">
<a class="nav-link active" href="#" aria-current="page">Home</a>
Update visual tests.
2016-11-12 16:12:58 +01:00
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Link</a>
</li>
</ul>
</div>
</nav>
<div class="container mt-3">
<h1>Modal <small>Bootstrap Visual Test</small></h1>
Add role="dialog" in modals via JavaScript (#30936)
2020-06-04 09:35:09 +02:00
<div class="modal fade" id="myModal" tabindex="-1" aria-labelledby="myModalLabel" aria-hidden="true">
Removed role="document" from the modal dialog (#30755)
2020-05-11 11:45:42 +02:00
<div class="modal-dialog">
Update visual tests.
2016-11-12 16:12:58 +01:00
<div class="modal-content">
<div class="modal-header">
Use `<h1>` for all `modal-title` examples/uses (#37210) * Use `fs-` font sizing classes where needed * Also add info callout about heading hierarchy in modals
2022-10-02 12:02:36 +02:00
<h1 class="modal-title fs-4" id="myModalLabel">Modal title</h1>
Fix `.close` instances (#32152)
2020-11-14 07:16:30 +01:00
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
remove closureness from plugins
2015-05-06 22:34:14 +02:00
</div>
Update visual tests.
2016-11-12 16:12:58 +01:00
<div class="modal-body">
<h4>Text in a modal</h4>
<p>Duis mollis, est non commodo luctus, nisi erat porttitor ligula.</p>
<h4>Popover in a modal</h4>
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<p>This <button type="button" class="btn btn-primary" data-bs-toggle="popover" data-bs-placement="left" title="Popover title" data-bs-content="And here's some amazing content. It's very engaging. Right?">button</button> should trigger a popover on click.</p>
Update visual tests.
2016-11-12 16:12:58 +01:00
<h4>Tooltips in a modal</h4>
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<p><a href="#" data-bs-toggle="tooltip" data-bs-placement="top" title="Tooltip on top">This link</a> and <a href="#" data-bs-toggle="tooltip" data-bs-placement="bottom" title="Tooltip on bottom">that link</a> should have tooltips on hover.</p>
Update visual tests.
2016-11-12 16:12:58 +01:00
Remove incorrect aria-multiselectable Closes https://github.com/twbs/bootstrap/issues/21635
2017-01-12 00:57:59 +01:00
<div id="accordion" role="tablist">
v5 tabs - accessibility issue when using ul/li semantic Add aria-role presentation on li element when ul element has role tablist and remove dropdown from visual tests as they've been removed from doc
2020-03-28 08:51:24 +01:00
<div class="card" role="presentation">
Update visual tests.
2016-11-12 16:12:58 +01:00
<div class="card-header" role="tab" id="headingOne">
<h5 class="mb-0">
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<a data-bs-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne">
Update visual tests.
2016-11-12 16:12:58 +01:00
Collapsible Group Item #1
</a>
</h5>
</div>
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<div id="collapseOne" class="collapse show" data-bs-parent="#accordion" role="tabpanel" aria-labelledby="headingOne">
Rename .card-block to .card-body to match nomenclature of modals
2017-06-15 07:01:16 +02:00
<div class="card-body">
Update visual tests.
2016-11-12 16:12:58 +01:00
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
v5 tabs - accessibility issue when using ul/li semantic Add aria-role presentation on li element when ul element has role tablist and remove dropdown from visual tests as they've been removed from doc
2020-03-28 08:51:24 +01:00
<div class="card" role="presentation">
Update visual tests.
2016-11-12 16:12:58 +01:00
<div class="card-header" role="tab" id="headingTwo">
<h5 class="mb-0">
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<a class="collapsed" data-bs-toggle="collapse" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
Update visual tests.
2016-11-12 16:12:58 +01:00
Collapsible Group Item #2
</a>
</h5>
</div>
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<div id="collapseTwo" class="collapse" data-bs-parent="#accordion" role="tabpanel" aria-labelledby="headingTwo">
Rename .card-block to .card-body to match nomenclature of modals
2017-06-15 07:01:16 +02:00
<div class="card-body">
Update visual tests.
2016-11-12 16:12:58 +01:00
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
</div>
v5 tabs - accessibility issue when using ul/li semantic Add aria-role presentation on li element when ul element has role tablist and remove dropdown from visual tests as they've been removed from doc
2020-03-28 08:51:24 +01:00
<div class="card" role="presentation">
Update visual tests.
2016-11-12 16:12:58 +01:00
<div class="card-header" role="tab" id="headingThree">
<h5 class="mb-0">
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<a class="collapsed" data-bs-toggle="collapse" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
Update visual tests.
2016-11-12 16:12:58 +01:00
Collapsible Group Item #3
</a>
</h5>
</div>
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<div id="collapseThree" class="collapse" data-bs-parent="#accordion" role="tabpanel" aria-labelledby="headingThree">
Rename .card-block to .card-body to match nomenclature of modals
2017-06-15 07:01:16 +02:00
<div class="card-body">
Update visual tests.
2016-11-12 16:12:58 +01:00
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
</div>
</div>
remove closureness from plugins
2015-05-06 22:34:14 +02:00
</div>
</div>
Update visual tests.
2016-11-12 16:12:58 +01:00
<hr>
<h4>Overflowing text to show scroll behavior</h4>
<p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
<p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
<p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
<p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
<p>Cras mattis consectetur purus sit amet fermentum. Cras justo odio, dapibus ac facilisis in, egestas eget quam. Morbi leo risus, porta ac consectetur ac, vestibulum at eros.</p>
<p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p>
<p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</p>
</div>
<div class="modal-footer">
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
Update visual tests.
2016-11-12 16:12:58 +01:00
<button type="button" class="btn btn-primary">Save changes</button>
remove closureness from plugins
2015-05-06 22:34:14 +02:00
</div>
</div>
Adds isolated visual tests for javascript plugins (decoupled from docs). This makes it faster and easier to test/develop js functionality not represented in unit tests, and gives us a playground for interactions, etc. It also makes it so developing javascript is now decoupled form jekyll, which should make everything faster and less painful. This commit also reverts my filter commit https://github.com/twbs/bootstrap/commit/9900771aa7f1b3ddcee49aec84082104776ace70 which broke scrollspy for dropdowns.
2014-06-08 04:11:44 +02:00
</div>
</div>
Update visual tests.
2016-11-12 16:12:58 +01:00
Add role="dialog" in modals via JavaScript (#30936)
2020-06-04 09:35:09 +02:00
<div class="modal fade" id="firefoxModal" tabindex="-1" aria-labelledby="firefoxModalLabel" aria-hidden="true">
Removed role="document" from the modal dialog (#30755)
2020-05-11 11:45:42 +02:00
<div class="modal-dialog">
Update visual tests.
2016-11-12 16:12:58 +01:00
<div class="modal-content">
<div class="modal-header">
Use `<h1>` for all `modal-title` examples/uses (#37210) * Use `fs-` font sizing classes where needed * Also add info callout about heading hierarchy in modals
2022-10-02 12:02:36 +02:00
<h1 class="modal-title fs-4" id="firefoxModalLabel">Firefox Bug Test</h1>
Fix `.close` instances (#32152)
2020-11-14 07:16:30 +01:00
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
Update visual tests.
2016-11-12 16:12:58 +01:00
</div>
<div class="modal-body">
<ol>
<li>Ensure you're using Firefox.</li>
<li>Open a new tab and then switch back to this tab.</li>
<li>Click into this input: <input type="text" id="ff-bug-input"></li>
<li>Switch to the other tab and then back to this tab.</li>
</ol>
<p>Test result: <strong id="ff-bug-test-result"></strong></p>
</div>
<div class="modal-footer">
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
Update visual tests.
2016-11-12 16:12:58 +01:00
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
Add visual test for #18365 See also https://bugzilla.mozilla.org/show_bug.cgi?id=1228802
2015-12-23 07:02:33 +01:00
</div>
</div>
Update visual tests.
2016-11-12 16:12:58 +01:00
Add role="dialog" in modals via JavaScript (#30936)
2020-06-04 09:35:09 +02:00
<div class="modal fade" id="slowModal" tabindex="-1" aria-labelledby="slowModalLabel" aria-hidden="true" style="transition-duration: 5s;">
Removed role="document" from the modal dialog (#30755)
2020-05-11 11:45:42 +02:00
<div class="modal-dialog" style="transition-duration: inherit;">
Variable transition durations (#25662)
2018-03-13 09:59:20 +01:00
<div class="modal-content">
<div class="modal-header">
Use `<h1>` for all `modal-title` examples/uses (#37210) * Use `fs-` font sizing classes where needed * Also add info callout about heading hierarchy in modals
2022-10-02 12:02:36 +02:00
<h1 class="modal-title fs-4" id="slowModalLabel">Lorem slowly</h1>
Fix `.close` instances (#32152)
2020-11-14 07:16:30 +01:00
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
Variable transition durations (#25662)
2018-03-13 09:59:20 +01:00
</div>
<div class="modal-body">
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Nullam quis risus eget urna mollis ornare vel eu leo. Nulla vitae elit libero, a pharetra augue.</p>
</div>
<div class="modal-footer">
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
Variable transition durations (#25662)
2018-03-13 09:59:20 +01:00
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div>
</div>
</div>
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<button type="button" class="btn btn-primary btn-lg" data-bs-toggle="modal" data-bs-target="#myModal">
Update visual tests.
2016-11-12 16:12:58 +01:00
Launch demo modal
</button>
<button type="button" class="btn btn-primary btn-lg" id="tall-toggle">
Toggle tall &lt;body&gt; content
</button>
<br><br>
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<button type="button" class="btn btn-secondary btn-lg" data-bs-toggle="modal" data-bs-target="#firefoxModal">
Update visual tests.
2016-11-12 16:12:58 +01:00
Launch Firefox bug test modal
</button>
(<a href="https://github.com/twbs/bootstrap/issues/18365">See Issue #18365</a>)
<br><br>
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
<button type="button" class="btn btn-secondary btn-lg" data-bs-toggle="modal" data-bs-target="#slowModal">
Variable transition durations (#25662)
2018-03-13 09:59:20 +01:00
Launch modal with slow transition
</button>
<br><br>
Docs: quick fixes for HTML (#36395) * Using the new helper in the doc * Remove input from `Tab` access * Change scrollspy code examples * Reordering tables for JS * Fix for parcel file * Center align all the code example texts in layout * Alphabetical reorder the helpers
2022-05-20 19:21:48 +02:00
<div class="text-bg-dark p-2" id="tall" style="display: none;">
Update visual tests.
2016-11-12 16:12:58 +01:00
Tall body content to force the page to have a scrollbar.
</div>
Fix XSS in data-target
2017-08-25 21:54:49 +02:00
Use `<h1>` for all `modal-title` examples/uses (#37210) * Use `fs-` font sizing classes where needed * Also add info callout about heading hierarchy in modals
2022-10-02 12:02:36 +02:00
<button type="button" class="btn btn-secondary btn-lg" data-bs-toggle="modal" data-bs-target="&#x3C;div class=&#x22;modal fade the-bad&#x22; tabindex=&#x22;-1&#x22;&#x3E;&#x3C;div class=&#x22;modal-dialog&#x22;&#x3E;&#x3C;div class=&#x22;modal-content&#x22;&#x3E;&#x3C;div class=&#x22;modal-header&#x22;&#x3E;&#x3C;button type=&#x22;button&#x22; class=&#x22;btn-close&#x22; data-bs-dismiss=&#x22;modal&#x22; aria-label=&#x22;Close&#x22;&#x3E;&#x3C;span aria-hidden=&#x22;true&#x22;&#x3E;&#x26;times;&#x3C;/span&#x3E;&#x3C;/button&#x3E;&#x3C;h1 class=&#x22;modal-title fs-4&#x22;&#x3E;The Bad Modal&#x3C;/h1&#x3E;&#x3C;/div&#x3E;&#x3C;div class=&#x22;modal-body&#x22;&#x3E;This modal&#x27;s HTTML source code is declared inline, inside the data-bs-target attribute of it&#x27;s show-button&#x3C;/div&#x3E;&#x3C;/div&#x3E;&#x3C;/div&#x3E;&#x3C;/div&#x3E;">
Add `bs` in data attributes - Add `bs` in data APIs everywhere - Update unit tests
2020-07-22 21:33:11 +02:00
Modal with an XSS inside the data-bs-target
Fix XSS in data-target
2017-08-25 21:54:49 +02:00
</button>
Modal plugin set _isTransitioning after the trigger of hide event
2017-10-10 13:19:39 +02:00
<br><br>
<button type="button" class="btn btn-secondary btn-lg" id="btnPreventModal">
Launch prevented modal on hide (to see the result open your console)
</button>
Add visual test for #18365 See also https://bugzilla.mozilla.org/show_bug.cgi?id=1228802
2015-12-23 07:02:33 +01:00
</div>
Update visual tests.
2016-11-12 16:12:58 +01:00
Fix visual tests (#35585) * Fix visual tests They broke in #34509 * load bundle.js in visual tests Co-authored-by: GeoSot <geo.sotis@gmail.com>
2022-01-30 15:12:24 +01:00
<script src="../../../dist/js/bootstrap.bundle.js"></script>
Update visual tests.
2016-11-12 16:12:58 +01:00
<script>
Add eslint-plugin-html to lint JS in HTML files (#37186)
2022-09-27 21:53:59 +02:00
/* global bootstrap: false */
Use es6 on visual tests (#36915)
2022-09-22 00:48:23 +02:00
const ffBugTestResult = document.getElementById('ff-bug-test-result')
const firefoxTestDone = false
fix(visual-test): remove jquery in them
2018-06-17 23:09:04 +02:00
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
function reportFirefoxTestResult(result) {
if (!firefoxTestDone) {
ffBugTestResult.classList.add(result ? 'text-success' : 'text-danger')
modal.html: use `textContent` (#32101) We are not handling any HTML
2020-11-09 19:47:33 +01:00
ffBugTestResult.textContent = result ? 'PASS' : 'FAIL'
Update visual tests.
2016-11-12 16:12:58 +01:00
}
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
}
Update visual tests.
2016-11-12 16:12:58 +01:00
Use es6 on visual tests (#36915)
2022-09-22 00:48:23 +02:00
document.querySelectorAll('[data-bs-toggle="popover"]').forEach(popoverEl => new bootstrap.Popover(popoverEl))
document.querySelectorAll('[data-bs-toggle="tooltip"]').forEach(tooltipEl => new bootstrap.Tooltip(tooltipEl))
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
Use es6 on visual tests (#36915)
2022-09-22 00:48:23 +02:00
const tall = document.getElementById('tall')
document.getElementById('tall-toggle').addEventListener('click', () => {
Add eslint-plugin-html to lint JS in HTML files (#37186)
2022-09-27 21:53:59 +02:00
tall.style.display = tall.style.display === 'none' ? 'block' : 'none'
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
})
fix(visual-test): remove jquery in them
2018-06-17 23:09:04 +02:00
Use es6 on visual tests (#36915)
2022-09-22 00:48:23 +02:00
const ffBugInput = document.getElementById('ff-bug-input')
const firefoxModal = document.getElementById('firefoxModal')
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
function handlerClickFfBugInput() {
firefoxModal.addEventListener('focus', reportFirefoxTestResult.bind(false))
ffBugInput.addEventListener('focus', reportFirefoxTestResult.bind(true))
ffBugInput.removeEventListener('focus', handlerClickFfBugInput)
}
Add eslint-plugin-html to lint JS in HTML files (#37186)
2022-09-27 21:53:59 +02:00
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
ffBugInput.addEventListener('focus', handlerClickFfBugInput)
fix(visual-test): remove jquery in them
2018-06-17 23:09:04 +02:00
Use es6 on visual tests (#36915)
2022-09-22 00:48:23 +02:00
const modalFf = new bootstrap.Modal(firefoxModal)
fix(visual-test): remove jquery in them
2018-06-17 23:09:04 +02:00
Use es6 on visual tests (#36915)
2022-09-22 00:48:23 +02:00
document.getElementById('btnPreventModal').addEventListener('click', () => {
const shownFirefoxModal = () => {
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
modalFf.hide()
firefoxModal.removeEventListener('shown.bs.modal', hideFirefoxModal)
}
Use es6 on visual tests (#36915)
2022-09-22 00:48:23 +02:00
const hideFirefoxModal = event => {
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
event.preventDefault()
firefoxModal.removeEventListener('hide.bs.modal', hideFirefoxModal)
fix(visual-test): remove jquery in them
2018-06-17 23:09:04 +02:00
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
if (modalFf._isTransitioning) {
console.error('Modal plugin should not set _isTransitioning when hide event is prevented')
} else {
console.log('Test passed')
modalFf.hide() // work as expected
fix(visual-test): remove jquery in them
2018-06-17 23:09:04 +02:00
}
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
}
fix(visual-test): remove jquery in them
2018-06-17 23:09:04 +02:00
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
firefoxModal.addEventListener('shown.bs.modal', shownFirefoxModal)
firefoxModal.addEventListener('hide.bs.modal', hideFirefoxModal)
modalFf.show()
})
Variable transition durations (#25662)
2018-03-13 09:59:20 +01:00
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
// Test transition duration
Use es6 on visual tests (#36915)
2022-09-22 00:48:23 +02:00
let t0
let t1
const slowModal = document.getElementById('slowModal')
Variable transition durations (#25662)
2018-03-13 09:59:20 +01:00
Use es6 on visual tests (#36915)
2022-09-22 00:48:23 +02:00
slowModal.addEventListener('shown.bs.modal', () => {
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
t1 = performance.now()
console.log('transition-duration took ' + (t1 - t0) + 'ms.')
})
Variable transition durations (#25662)
2018-03-13 09:59:20 +01:00
Use es6 on visual tests (#36915)
2022-09-22 00:48:23 +02:00
slowModal.addEventListener('show.bs.modal', () => {
Remove DOMContentLoaded. (#28337) There's no reason for us to wait here.
2019-02-24 14:42:18 +01:00
t0 = performance.now()
Update visual tests.
2016-11-12 16:12:58 +01:00
})
</script>
</body>
Adds isolated visual tests for javascript plugins (decoupled from docs). This makes it faster and easier to test/develop js functionality not represented in unit tests, and gives us a playground for interactions, etc. It also makes it so developing javascript is now decoupled form jekyll, which should make everything faster and less painful. This commit also reverts my filter commit https://github.com/twbs/bootstrap/commit/9900771aa7f1b3ddcee49aec84082104776ace70 which broke scrollspy for dropdowns.
2014-06-08 04:11:44 +02:00
</html>
Reference in New Issue Copy Permalink