Skip to content

Commit

Permalink
Merge pull request #901 from webcompat/refactor
Browse files Browse the repository at this point in the history
Refactoring HTML, CSS, View, Markup
  • Loading branch information
magsout committed Jan 29, 2016
2 parents eed01d1 + 9b7e42a commit 60637b1
Show file tree
Hide file tree
Showing 118 changed files with 2,789 additions and 2,515 deletions.
3 changes: 2 additions & 1 deletion grunt-tasks/cssnext.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,8 @@ module.exports = function(grunt) {
sourcemap: true,
url : false,
browsers: ['ff >= 4', 'ie >= 8', 'safari >= 5.1', 'opera >= 12', 'chrome >=10'],
import: { path: ['node_modules'] }
import: { path: ['node_modules'] },
messages: {browser: false, console: true}
},
dist: {
files: {
Expand Down
1 change: 1 addition & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@
},
"devDependencies": {
"cssrecipes-custom-media-queries": "0.3.0",
"cssrecipes-defaults": "^0.5.0",
"cssrecipes-grid": "^0.4.0",
"cssrecipes-reset": "^0.5.0",
"cssrecipes-utils": "^0.5.0",
Expand Down
32 changes: 16 additions & 16 deletions tests/functional/comments-auth.js
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ define([
.setFindTimeout(intern.config.wc.pageLoadTimeout)
.get(require.toUrl(url('/issues/100')))
.sleep(2000)
.findByCssSelector('.wc-Comment--form').isDisplayed()
.findByCssSelector('.js-Comment-form').isDisplayed()
.then(function(isDisplayed) {
assert.equal(isDisplayed, true, 'Comment form visible for logged in users.');
})
Expand All @@ -43,19 +43,19 @@ define([
return this.remote
.setFindTimeout(intern.config.wc.pageLoadTimeout)
.get(require.toUrl(url('/issues/100')))
.findByCssSelector('.js-issue-comment:nth-of-type(3)')
.findByCssSelector('.js-Issue-comment:nth-of-type(3)')
.end()
.findByCssSelector('.js-issue-state-button').getVisibleText()
.findByCssSelector('.js-Issue-state-button').getVisibleText()
.then(function(text) {
assert.equal('Close Issue', text);
assert.notEqual('Close and comment', text);
})
.end()
.findByCssSelector('textarea.wc-Comment-text')
.findByCssSelector('textarea.js-Comment-text')
.type('test comment')
.end()
.sleep(1000)
.findByCssSelector('.js-issue-state-button').getVisibleText()
.findByCssSelector('.js-Issue-state-button').getVisibleText()
.then(function(text) {
assert.equal('Close and comment', text);
assert.notEqual('Close Issue', text);
Expand All @@ -66,19 +66,19 @@ define([
return this.remote
.setFindTimeout(intern.config.wc.pageLoadTimeout)
.get(require.toUrl(url('/issues/101')))
.findByCssSelector('.js-issue-comment:nth-of-type(3)')
.findByCssSelector('.js-Issue-comment:nth-of-type(3)')
.end()
.findByCssSelector('.js-issue-state-button').getVisibleText()
.findByCssSelector('.js-Issue-state-button').getVisibleText()
.then(function(text) {
assert.equal('Reopen Issue', text);
assert.notEqual('Reopen and comment', text);
})
.end()
.findByCssSelector('textarea.wc-Comment-text')
.findByCssSelector('textarea.js-Comment-text')
.type('test comment')
.end()
.sleep(1000)
.findByCssSelector('.js-issue-state-button').getVisibleText()
.findByCssSelector('.js-Issue-state-button').getVisibleText()
.then(function(text) {
assert.equal('Reopen and comment', text);
assert.notEqual('Reopen Issue', text);
Expand All @@ -91,20 +91,20 @@ define([
return this.remote
.setFindTimeout(intern.config.wc.pageLoadTimeout)
.get(require.toUrl(url('/issues/100')))
.findAllByCssSelector('.js-issue-comment:not(.wc-Comment--form)')
.findAllByCssSelector('.js-Issue-comment')
.then(function(elms) {
originalCommentsLength = elms.length;
})
.end()
.findByCssSelector('textarea.wc-Comment-text')
.findByCssSelector('textarea.js-Comment-text')
.type('Today\'s date is ' + new Date().toDateString())
.end()
.sleep(2000)
// click the comment button
.findByCssSelector('.js-issue-comment-button').click()
.findByCssSelector('.js-Issue-comment-button').click()
.end()
.sleep(2000)
.findAllByCssSelector('.js-issue-comment:not(.wc-Comment--form)')
.findAllByCssSelector('.js-Issue-comment')
.then(function(elms) {
allCommentsLength = elms.length;
assert(originalCommentsLength < allCommentsLength, 'Comment was successfully left.');
Expand All @@ -117,16 +117,16 @@ define([
return this.remote
.setFindTimeout(intern.config.wc.pageLoadTimeout)
.get(require.toUrl(url('/issues/100')))
.findAllByCssSelector('.js-issue-comment:not(.wc-Comment--form)')
.findAllByCssSelector('.js-Issue-comment')
.then(function(elms) {
originalCommentsLength = elms.length;
})
.end()
// click the comment button
.findByCssSelector('.js-issue-comment-button').click()
.findByCssSelector('.js-Issue-comment-button').click()
.end()
.sleep(500)
.findAllByCssSelector('.js-issue-comment:not(.wc-Comment--form)')
.findAllByCssSelector('.js-Issue-comment')
.then(function(elms) {
allCommentsLength = elms.length;
assert(originalCommentsLength === allCommentsLength, 'Comment was not successfully left.');
Expand Down
2 changes: 1 addition & 1 deletion tests/functional/comments-non-auth.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ define([
return this.remote
.setFindTimeout(1000)
.get(require.toUrl(url('/issues/200')))
.findByCssSelector('.wc-Comment--form')
.findByCssSelector('.js-Comment-form')
.then(assert.fail, function(err) {
assert.isTrue(/NoSuchElement/.test(String(err)));
})
Expand Down
12 changes: 6 additions & 6 deletions tests/functional/contributors-non-auth.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ define([
'page loads': function() {
return this.remote
.get(require.toUrl(url('/contributors')))
.findByCssSelector('.wc-Hero-title').getVisibleText()
.findByCssSelector('.js-Hero-title').getVisibleText()
.then(function(text) {
assert.include(text, 'Welcome aboard!');
})
Expand All @@ -38,7 +38,7 @@ define([
assert.notInclude('is-open', className);
})
.end()
.findByCssSelector('.wc-Hero-SVG').getAttribute('class')
.findByCssSelector('.js-Hero-svg').getAttribute('class')
.then(function(className) {
assert.notEqual('is-active', className);
})
Expand All @@ -54,7 +54,7 @@ define([
assert.equal(isDisplayed, true);
})
.end()
.findByCssSelector('.wc-Hero-SVG.is-active').isDisplayed()
.findByCssSelector('.js-Hero-svg.is-active').isDisplayed()
.then(function(isDisplayed) {
assert.equal(isDisplayed, true);
})
Expand All @@ -66,7 +66,7 @@ define([
assert.notInclude('is-open', className);
})
.end()
.findByCssSelector('.wc-Hero-SVG').getAttribute('class')
.findByCssSelector('.js-Hero-svg').getAttribute('class')
.then(function(className) {
assert.notInclude('is-active', className);
});
Expand All @@ -76,14 +76,14 @@ define([
return this.remote
.setFindTimeout(intern.config.wc.pageLoadTimeout)
.get(require.toUrl(url('/contributors')))
.findByCssSelector('.wc-Hero-SVG.is-active').isDisplayed()
.findByCssSelector('.js-Hero-svg.is-active').isDisplayed()
.then(function(isDisplayed) {
assert.equal(isDisplayed, true);
})
.end()
.findByCssSelector('.contributors__item__title').click()
.end()
.findByCssSelector('.wc-Hero-SVG').getAttribute('class')
.findByCssSelector('.js-Hero-svg').getAttribute('class')
.then(function(className) {
assert.notInclude('is-active', className);
});
Expand Down
4 changes: 2 additions & 2 deletions tests/functional/history-navigation-non-auth.js
Original file line number Diff line number Diff line change
Expand Up @@ -23,11 +23,11 @@ define([
.findByCssSelector('.js-issues-link').click()
.end()
//find an issue so we know the page has loaded
.findByCssSelector('div.wc-IssueItem:nth-child(1)')
.findByCssSelector('.js-IssueList:nth-child(1)')
.end()
.goBack()
// now check that we're back at the home page.
.findByCssSelector('.wc-Hero-title').getVisibleText()
.findByCssSelector('.js-Hero-title').getVisibleText()
.then(function(text) {
assert.equal(text, 'Bug reporting\nfor the internet.');
})
Expand Down
28 changes: 15 additions & 13 deletions tests/functional/index-non-auth.js
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ define([
'front page loads': function() {
return this.remote
.get(require.toUrl(url('/')))
.findByCssSelector('.wc-Hero-title').getVisibleText()
.findByCssSelector('.js-Hero-title').getVisibleText()
.then(function(text) {
assert.equal(text, 'Bug reporting\nfor the internet.');
})
Expand All @@ -30,7 +30,7 @@ define([
'reporter addon link is shown': function() {
return this.remote
.get(require.toUrl(url('/')))
.findByCssSelector('.wc-Navbar-link').getVisibleText()
.findByCssSelector('.js-Navbar-link').getVisibleText()
.then(function(text) {
assert.include(text, 'Download our Firefox');
})
Expand All @@ -41,50 +41,52 @@ define([
return this.remote
.setFindTimeout(intern.config.wc.pageLoadTimeout)
.get(require.toUrl(url('/')))
.findByCssSelector('#report-bug.is-closed').click()
.findByCssSelector('#js-ReportBug').click()
.end()
.findByCssSelector('.form-opened').isDisplayed()
.findByCssSelector('#js-ReportForm').isDisplayed()
.then(function(isDisplayed) {
assert.equal(isDisplayed, true);
})
.end()
.findByCssSelector('#report-bug.is-open').click()
.findByCssSelector('#js-ReportBug').click()
.end()
.findByCssSelector('.form-closed').isDisplayed()
// we need to wait for the animation to end before checking.
.sleep(1000)
.findByCssSelector('#js-ReportForm').isDisplayed()
.then(function(isDisplayed) {
assert.equal(isDisplayed, false);
assert.equal(isDisplayed, false, 'The form should be hidden');
});
},

'browse issues (new)': function() {
return this.remote
.get(require.toUrl(url('/')))
.findAllByCssSelector('#new .wc-IssueItem.wc-IssueItem--new')
.findAllByCssSelector('#js-lastIssue .js-IssueList.wc-IssueList--new')
.then(function(elms) {
assert.equal(elms.length, 10, '10 issues should be displayed');
})
.end()
.findByCssSelector('.wc-IssueItem--new .wc-IssueItem-count').getVisibleText()
.findByCssSelector('.wc-IssueList--new .wc-IssueList-count').getVisibleText()
.then(function(text) {
assert.match(text, /^Issue\s(\d+)$/, 'Issue should have a number');
})
.end()
.findByCssSelector('.wc-IssueItem--new .wc-IssueItem-header a').getAttribute('href')
.findByCssSelector('.wc-IssueList--new .wc-IssueList-header a').getAttribute('href')
.then(function(text) {
assert.match(text, /^\/issues\/\d+$/, 'Link should have a number');
})
.end()
.findByCssSelector('.wc-IssueItem--new .wc-IssueItem-header').getVisibleText()
.findByCssSelector('.wc-IssueList--new .wc-IssueList-header').getVisibleText()
.then(function(text) {
assert.match(text, /^Issue\s\d+:\s.+$/, 'Issue should have a non-empty title');
})
.end()
.findByCssSelector('.wc-IssueItem--new .wc-IssueItem-metadata:nth-child(1)').getVisibleText()
.findByCssSelector('.wc-IssueList--new .wc-IssueList-metadata:nth-child(1)').getVisibleText()
.then(function(text) {
assert.match(text, /^Opened:\s\d{4}\-\d{2}\-\d{2}/, 'Issue should display creation date');
})
.end()
.findByCssSelector('.wc-IssueItem--new .wc-IssueItem-metadata:nth-child(2)').getVisibleText()
.findByCssSelector('.wc-IssueList--new .wc-IssueList-metadata:nth-child(2)').getVisibleText()
.then(function(text) {
assert.match(text, /Comments:\s\d/, 'Issue should display number of comments');
})
Expand Down
Loading

0 comments on commit 60637b1

Please sign in to comment.