* Add JS tips section to frontend documentation
* Replace document.getElementsByTagName('body') with document.body
* Replace querySelectorAll with faster selecting methods where appropriate
* Replace querySelector with faster selecting methods where appropriate
* Fix typo
* Fix forEach and getElementsByClassName
* Change querySelector* to faster methods in erb files
* Change querySelector* to faster methods in ruby files
* Fix runkit tag
* Various fixes
* Update app/assets/javascripts/initializers/initializeEllipsisMenu.js
Co-authored-by: Ridhwana <Ridhwana.Khan16@gmail.com>
* Update app/assets/javascripts/utilities/slideSidebar.js
Co-authored-by: Ridhwana <Ridhwana.Khan16@gmail.com>
* Commenting out flaky spec
Co-authored-by: Ridhwana <Ridhwana.Khan16@gmail.com>
54 lines
1.8 KiB
JavaScript
54 lines
1.8 KiB
JavaScript
import initializeActionsPanel from '../initializeActionsPanelToggle';
|
|
|
|
describe('toggling the actions panel', () => {
|
|
describe('when the page is the article show page', () => {
|
|
document.body.innerHTML = `
|
|
<div class="mod-actions-menu"></div>
|
|
<div id="mod-actions-menu-btn-area"></div>
|
|
`;
|
|
const path = '/fakeuser/fake-article-slug-1d3a';
|
|
|
|
test('it should render the mod actions menu button', () => {
|
|
initializeActionsPanel(path);
|
|
expect(
|
|
document.querySelector(
|
|
`iframe#mod-container[src="${path}/actions_panel"]`,
|
|
),
|
|
).toBeDefined();
|
|
expect(
|
|
document.getElementsByClassName('mod-actions-menu-btn')[0],
|
|
).not.toBeNull();
|
|
expect(
|
|
document.getElementsByClassName('actions-menu-svg')[0],
|
|
).not.toBeNull();
|
|
});
|
|
|
|
test('it should have a click listener that toggles the appropriate classes', () => {
|
|
initializeActionsPanel(path);
|
|
|
|
const modContainer = document.getElementById('mod-container');
|
|
modContainer.contentWindow.document.write(
|
|
`<html><body><button class="close-actions-panel hidden"></body></html>`,
|
|
);
|
|
|
|
const modActionsMenu = document.getElementsByClassName(
|
|
'mod-actions-menu',
|
|
)[0];
|
|
const modActionsMenuBtn = document.getElementsByClassName(
|
|
'mod-actions-menu-btn',
|
|
)[0];
|
|
|
|
modActionsMenuBtn.click();
|
|
|
|
expect(modActionsMenu.classList.contains('showing')).toBeTruthy();
|
|
expect(modActionsMenuBtn.classList.contains('hidden')).toBeTruthy();
|
|
|
|
const panelDocument = modContainer.contentDocument;
|
|
|
|
const closeButton = panelDocument.getElementsByClassName(
|
|
'close-actions-panel',
|
|
)[0];
|
|
expect(closeButton.classList.contains('hidden')).toBeFalsy();
|
|
});
|
|
});
|
|
});
|