Commit 673806a2 authored by Luke Bennett's avatar Luke Bennett

Some more styling tweaks and added jasmine test

parent 1e6d8a38
window.gl = window.gl || {};
((global) => {
const MAX_MESSAGE_LENGTH = 500;
const MESSAGE_CELL_SELECTOR = '.abuse-reports .message';
......@@ -16,7 +17,7 @@
if (reportMessage.length > MAX_MESSAGE_LENGTH) {
$messageCellElement.data('original-message', reportMessage);
$messageCellElement.data('message-truncated', 'true');
$messageCellElement.text(`${reportMessage.substr(0, MAX_MESSAGE_LENGTH)}...`);
$messageCellElement.text(`${reportMessage.substr(0, (MAX_MESSAGE_LENGTH - 3))}...`);
}
}
......@@ -29,7 +30,7 @@
$messageCellElement.text(originalMessage);
} else {
$messageCellElement.data('message-truncated', 'true');
$messageCellElement.text(`${originalMessage.substr(0, MAX_MESSAGE_LENGTH)}...`);
$messageCellElement.text(`${originalMessage.substr(0, (MAX_MESSAGE_LENGTH - 3))}...`);
}
}
}
......
......@@ -99,10 +99,16 @@
}
.abuse-reports {
.table {
table-layout: fixed;
.action-buttons a {
white-space: normal;
}
.subheading {
padding-bottom: $gl-padding;
}
.message {
word-wrap: break-word;
}
th {
width: 15%;
&.wide {
......@@ -118,6 +124,7 @@
float: left;
}
}
.no-reports {
.emoji-icon {
margin-left: $btn-side-margin;
......
- reporter = abuse_report.reporter
- user = abuse_report.user
%tr
%th.visible-xs-block.visible-sm-block User
%th.visible-xs-block.visible-sm-block
%strong User
%td
- if user
= link_to user.name, user
......@@ -10,7 +11,7 @@
- else
(removed)
%td
%strong.visible-xs-block.visible-sm-block Reported by
%strong.subheading.visible-xs-block.visible-sm-block Reported by
- if reporter
= link_to reporter.name, reporter
- else
......@@ -18,7 +19,7 @@
.light.small
= time_ago_with_tooltip(abuse_report.created_at)
%td
%strong.visible-xs-block.visible-sm-block Message
%strong.subheading.visible-xs-block.visible-sm-block Message
.message
= markdown(abuse_report.message.squish!, pipeline: :single_line, author: reporter)
%td
......
/*= require abuse_reports */
/*= require jquery */
((global) => {
const FIXTURE = 'abuse_reports.html';
const MAX_MESSAGE_LENGTH = 500;
function assertMaxLength($message) {
expect($message.text().length).toEqual(MAX_MESSAGE_LENGTH);
}
describe('Abuse Reports', function() {
fixture.preload(FIXTURE);
beforeEach(function() {
fixture.load(FIXTURE);
new global.AbuseReports();
});
it('should truncate long messages', function() {
const $longMessage = $('#long');
expect($longMessage.data('original-message')).toEqual(jasmine.anything());
assertMaxLength($longMessage);
});
it('should not truncate short messages', function() {
const $shortMessage = $('#short');
expect($shortMessage.data('original-message')).not.toEqual(jasmine.anything());
});
it('should allow clicking a truncated message to expand and collapse the full message', function() {
const $longMessage = $('#long');
$longMessage.click();
expect($longMessage.data('original-message').length).toEqual($longMessage.text().length);
$longMessage.click();
assertMaxLength($longMessage);
});
});
})(window.gl);
.abuse-reports
.message#long
Cat ipsum dolor sit amet, hide head under blanket so no one can see.
Gate keepers of hell eat and than sleep on your face but hunt by meowing
loudly at 5am next to human slave food dispenser cats go for world
domination or chase laser, yet poop on grasses chirp at birds. Cat is love,
cat is life chase after silly colored fish toys around the house climb a
tree, wait for a fireman jump to fireman then scratch his face fall asleep
on the washing machine lies down always hungry so caticus cuteicus. Sit on
human. Spot something, big eyes, big eyes, crouch, shake butt, prepare to
pounce sleep in the bathroom sink hiss at vacuum cleaner hide head under
blanket so no one can see throwup on your pillow.
.message#short
Cat ipsum dolor sit amet, groom yourself 4 hours - checked, have your
beauty sleep 18 hours - checked, be fabulous for the rest of the day -
checked! for shake treat bag.
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment