[IMP] Tour improvements => automated tests
bzr revid: ddm@openerp.com-20131209112534-3ysihjgm20jj3d9k
This commit is contained in:
parent
3aeff80969
commit
5f0fcfb9be
|
@ -246,6 +246,9 @@
|
||||||
this.snippet_focus($snippet);
|
this.snippet_focus($snippet);
|
||||||
}
|
}
|
||||||
$("#oe_snippets").trigger('snippet-activated', $snippet);
|
$("#oe_snippets").trigger('snippet-activated', $snippet);
|
||||||
|
if ($snippet) {
|
||||||
|
$snippet.trigger('snippet-activated', $snippet);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
create_overlay: function ($snippet) {
|
create_overlay: function ($snippet) {
|
||||||
if (typeof $snippet.data("snippet-editor") === 'undefined') {
|
if (typeof $snippet.data("snippet-editor") === 'undefined') {
|
||||||
|
|
|
@ -46,7 +46,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
stepId: 'drag-banner',
|
stepId: 'drag-banner',
|
||||||
element: '#website-top-navbar [data-snippet-id=carousel].ui-draggable',
|
snippet: 'carousel',
|
||||||
placement: 'bottom',
|
placement: 'bottom',
|
||||||
title: "Drag & Drop a Banner",
|
title: "Drag & Drop a Banner",
|
||||||
content: "Drag the Banner block and drop it in your page.",
|
content: "Drag the Banner block and drop it in your page.",
|
||||||
|
@ -84,7 +84,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
stepId: 'drag-three-columns',
|
stepId: 'drag-three-columns',
|
||||||
element: '#website-top-navbar [data-snippet-id=three-columns].ui-draggable',
|
snippet: 'three-columns',
|
||||||
placement: 'bottom',
|
placement: 'bottom',
|
||||||
title: "Drag & Drop a Block",
|
title: "Drag & Drop a Block",
|
||||||
content: "Drag the <em>'3 Columns'</em> block and drop it below the banner.",
|
content: "Drag the <em>'3 Columns'</em> block and drop it below the banner.",
|
||||||
|
@ -97,7 +97,8 @@
|
||||||
title: "Edit an Area",
|
title: "Edit an Area",
|
||||||
content: "Select any area of the page to modify it. Click on this subtitle.",
|
content: "Select any area of the page to modify it. Click on this subtitle.",
|
||||||
trigger: {
|
trigger: {
|
||||||
id: 'snippet-activated'
|
emitter: '#wrap [data-snippet-id=three-columns]:first .text-center[data-snippet-id=colmd]',
|
||||||
|
id: 'snippet-activated',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
|
|
|
@ -27,6 +27,9 @@
|
||||||
if (!step.element) {
|
if (!step.element) {
|
||||||
step.orphan = true;
|
step.orphan = true;
|
||||||
}
|
}
|
||||||
|
if (step.snippet) {
|
||||||
|
step.element = '#oe_snippets div.oe_snippet[data-snippet-id="'+step.snippet+'"] .oe_snippet_thumbnail';
|
||||||
|
}
|
||||||
if (step.trigger) {
|
if (step.trigger) {
|
||||||
if (step.trigger === 'click') {
|
if (step.trigger === 'click') {
|
||||||
step.triggers = function (callback) {
|
step.triggers = function (callback) {
|
||||||
|
@ -48,8 +51,9 @@
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
step.triggers = function (callback) {
|
step.triggers = function (callback) {
|
||||||
var emitter = step.trigger.emitter || $(step.element);
|
var emitter = _.isString(step.trigger.emitter) ? $(step.trigger.emitter) : (step.trigger.emitter || $(step.element));
|
||||||
emitter.one(step.trigger.id, function customHandler () {
|
emitter.on(step.trigger.id, function customHandler () {
|
||||||
|
console.log(arguments);
|
||||||
(callback || self.moveToNextStep).apply(self, arguments);
|
(callback || self.moveToNextStep).apply(self, arguments);
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
@ -164,7 +168,7 @@
|
||||||
$('.popover.tour').remove();
|
$('.popover.tour').remove();
|
||||||
function advance () {
|
function advance () {
|
||||||
if (_.isFunction(callback)) {
|
if (_.isFunction(callback)) {
|
||||||
callback.call(self);
|
callback.apply(self);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
$(document.body).one('mouseup', advance);
|
$(document.body).one('mouseup', advance);
|
||||||
|
@ -215,7 +219,17 @@
|
||||||
});
|
});
|
||||||
|
|
||||||
var TestConsole = website.TestConsole = {
|
var TestConsole = website.TestConsole = {
|
||||||
tests: []
|
dragAndDropSnippet: function (snippetId) {
|
||||||
|
var selector = '#oe_snippets div.oe_snippet[data-snippet-id="'+snippetId+'"] .oe_snippet_thumbnail';
|
||||||
|
var $thumbnail = $(selector).first();
|
||||||
|
var thumbnailPosition = $thumbnail.position();
|
||||||
|
$thumbnail.trigger($.Event( "mousedown", { which: 1, pageX: thumbnailPosition.left, pageY: thumbnailPosition.top }));
|
||||||
|
$thumbnail.trigger($.Event( "mousemove", { which: 1, pageX: thumbnailPosition.left+100, pageY: thumbnailPosition.top+700 }));
|
||||||
|
var $dropZone = $(".oe_drop_zone").first();
|
||||||
|
var dropPosition = $dropZone.position();
|
||||||
|
$dropZone.trigger($.Event( "mouseup", { which: 1, pageX: dropPosition.left, pageY: dropPosition.top }));
|
||||||
|
},
|
||||||
|
tests: [],
|
||||||
};
|
};
|
||||||
|
|
||||||
website.EditorBar.include({
|
website.EditorBar.include({
|
||||||
|
@ -247,16 +261,22 @@
|
||||||
id: tour.id,
|
id: tour.id,
|
||||||
run: function runTest () {
|
run: function runTest () {
|
||||||
var actionSteps = _.filter(tour.steps, function (step) {
|
var actionSteps = _.filter(tour.steps, function (step) {
|
||||||
return step.triggers;
|
return step.trigger;
|
||||||
});
|
});
|
||||||
var currentIndex = 0;
|
var currentIndex = 0;
|
||||||
function executeStep (step) {
|
function executeStep (step) {
|
||||||
var $element = $(step.element);
|
var $element = $(step.element);
|
||||||
step.triggers(function () {
|
step.triggers(function () {
|
||||||
currentIndex = currentIndex + 1;
|
currentIndex = currentIndex + 1;
|
||||||
executeStep(actionSteps[currentIndex]);
|
executeStep(actionSteps[currentIndex]);
|
||||||
});
|
});
|
||||||
$element.click();
|
if (step.snippet && step.trigger === 'drag') {
|
||||||
|
setTimeout(function () {
|
||||||
|
TestConsole.dragAndDropSnippet(step.snippet);
|
||||||
|
}, 50);
|
||||||
|
} else {
|
||||||
|
$element.click();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
executeStep(actionSteps[currentIndex]);
|
executeStep(actionSteps[currentIndex]);
|
||||||
},
|
},
|
||||||
|
|
|
@ -51,7 +51,7 @@
|
||||||
title: "Which Blog?",
|
title: "Which Blog?",
|
||||||
content: "Blog posts are organized in multiple categories (news, job offers, events, etc). Select <em>News</em> and click <em>Continue</em>.",
|
content: "Blog posts are organized in multiple categories (news, job offers, events, etc). Select <em>News</em> and click <em>Continue</em>.",
|
||||||
trigger: {
|
trigger: {
|
||||||
emitter: $('.modal select'),
|
emitter: '.modal select',
|
||||||
id: 'change',
|
id: 'change',
|
||||||
predicate: function ($el, value) {
|
predicate: function ($el, value) {
|
||||||
return $el.find('[value='+value+']').text().toLowerCase() === 'news';
|
return $el.find('[value='+value+']').text().toLowerCase() === 'news';
|
||||||
|
@ -89,7 +89,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
stepId: 'drag-image-text',
|
stepId: 'drag-image-text',
|
||||||
element: '#website-top-navbar [data-snippet-id=image-text].ui-draggable',
|
snippet: 'image-text',
|
||||||
placement: 'bottom',
|
placement: 'bottom',
|
||||||
title: "Drag & Drop a Block",
|
title: "Drag & Drop a Block",
|
||||||
content: "Drag the <em>'Image-Text'</em> block and drop it in your page.",
|
content: "Drag the <em>'Image-Text'</em> block and drop it in your page.",
|
||||||
|
@ -105,7 +105,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
stepId: 'drag-text-block',
|
stepId: 'drag-text-block',
|
||||||
element: '#website-top-navbar [data-snippet-id=text-block].ui-draggable',
|
snippet: 'text-block',
|
||||||
placement: 'bottom',
|
placement: 'bottom',
|
||||||
title: "Drag & Drop a block",
|
title: "Drag & Drop a block",
|
||||||
content: "Drag the <em>'Text Block'</em> block and drop it below the image block.",
|
content: "Drag the <em>'Text Block'</em> block and drop it below the image block.",
|
||||||
|
|
|
@ -75,7 +75,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
stepId: 'drag-banner',
|
stepId: 'drag-banner',
|
||||||
element: '#website-top-navbar [data-snippet-id=carousel].ui-draggable',
|
snippet: 'carousel',
|
||||||
placement: 'bottom',
|
placement: 'bottom',
|
||||||
title: "Drag & Drop a block",
|
title: "Drag & Drop a block",
|
||||||
content: "Drag the 'Banner' block and drop it in your page.",
|
content: "Drag the 'Banner' block and drop it in your page.",
|
||||||
|
@ -91,7 +91,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
stepId: 'drag-text-block',
|
stepId: 'drag-text-block',
|
||||||
element: '#website-top-navbar [data-snippet-id=text-block].ui-draggable',
|
snipet: 'text-block',
|
||||||
placement: 'bottom',
|
placement: 'bottom',
|
||||||
title: "Drag & Drop a block",
|
title: "Drag & Drop a block",
|
||||||
content: "Drag the 'Text Block' block below the banner.",
|
content: "Drag the 'Text Block' block below the banner.",
|
||||||
|
@ -107,7 +107,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
stepId: 'drag-three-columns',
|
stepId: 'drag-three-columns',
|
||||||
element: '#website-top-navbar [data-snippet-id=three-columns].ui-draggable',
|
snippet: 'three-columns',
|
||||||
placement: 'bottom',
|
placement: 'bottom',
|
||||||
title: "Drag & Drop a block",
|
title: "Drag & Drop a block",
|
||||||
content: "Drag the 'Three Columns' block at the bottom.",
|
content: "Drag the 'Three Columns' block at the bottom.",
|
||||||
|
|
|
@ -113,7 +113,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
stepId: 'drag-big-picture',
|
stepId: 'drag-big-picture',
|
||||||
element: '#website-top-navbar [data-snippet-id=big-picture].ui-draggable',
|
snippet: 'big-picture',
|
||||||
placement: 'bottom',
|
placement: 'bottom',
|
||||||
title: "Drag & Drop a block",
|
title: "Drag & Drop a block",
|
||||||
content: "Drag the 'Big Picture' block and drop it in your page.",
|
content: "Drag the 'Big Picture' block and drop it in your page.",
|
||||||
|
|
Loading…
Reference in New Issue