* Remove unused CSS rules * Use bootstrap utility class over custom css * Fix grapical bug with buffer tags * Fix internal UI highlighting and misc fixes This commit is a little bit too big. It fixes a bug with the internal UI that was breaking the highlighting feature (indicates status of articles and when an AJAX request has been made). It also does some reformatting in the internal listings UI. This should make it a bit easier on anyone writing buffer updates in the listings UI. I was able to reapply some stimulus I wrote previously for this, super easy! There are also a couple of CSS classes I renamed to match Bootstrap's naming conventions. * Remove <br> tag * Update article_controller Stimulus test
63 lines
1.9 KiB
JavaScript
63 lines
1.9 KiB
JavaScript
import { Application } from 'stimulus';
|
|
import ArticleController from '../../controllers/article_controller';
|
|
import '../../__mocks__/mutationObserver';
|
|
|
|
describe('ArticleController', () => {
|
|
beforeEach(() => {
|
|
document.body.innerHTML = `<div data-controller="article">
|
|
<div class="card-body">
|
|
<button data-action="article#increaseFeaturedNumber"></button>
|
|
<button data-action="article#decreaseFeaturedNumber"></button>
|
|
<button data-action="article#highlightElement"></button>
|
|
<input data-target="article.featuredNumber"></input>
|
|
</div>
|
|
</div>`;
|
|
|
|
const application = Application.start();
|
|
application.register('article', ArticleController);
|
|
});
|
|
|
|
// Unix timestamp, one hour ago
|
|
const initialValue = Math.round((Date.now() - 3600000) / 1000);
|
|
|
|
describe('#increaseFeaturedNumber', () => {
|
|
it('increases the featured number input', () => {
|
|
const button = document.querySelectorAll('button')[0];
|
|
const input = document.querySelector(
|
|
"[data-target='article.featuredNumber']",
|
|
);
|
|
|
|
input.value = initialValue;
|
|
button.click();
|
|
|
|
expect(parseInt(input.value, 10)).toBeGreaterThan(initialValue);
|
|
});
|
|
});
|
|
|
|
describe('#decreaseFeaturedNumber', () => {
|
|
it('increases the featured number input', () => {
|
|
const button = document.querySelectorAll('button')[1];
|
|
const input = document.querySelector(
|
|
"[data-target='article.featuredNumber']",
|
|
);
|
|
|
|
input.value = initialValue;
|
|
button.click();
|
|
|
|
expect(parseInt(input.value, 10)).toBeLessThan(initialValue);
|
|
});
|
|
});
|
|
|
|
describe('#highlightElement', () => {
|
|
it('adds a class to the controller element', () => {
|
|
const button = document.querySelectorAll('button')[2];
|
|
const element = document.querySelector('.card-body');
|
|
|
|
button.click();
|
|
|
|
expect(
|
|
element.classList.contains('bg-highlighted', 'border-highlighted'),
|
|
).toBe(true);
|
|
});
|
|
});
|
|
});
|