[FIX] website_slides[_survey]: allow to share content after certification

When finishing (and succeeding) a certification in the e-learning module, you
can 'share' the content of the course by email.

But the "Send Email" button is unresponsive.

This is caused by having nested `<form>` tags: the one of the share modal is
inside the main survey form element.

To resolve this issue, we turn the `<form>` tag into a `<div>` tag in the
sharing template, as it does not need to be a form since it's never submitted.
Indeed, the sharing request is sent through attaching an event handler on the
"Send Email" button which still works fine after our tag replacement.

Note that this fix requires updating the module, but there is no (easy) way to
fix it otherwise, and we consider it acceptable as the impact is pretty low.

In addition to that, we also need to add a survey form JS override to correctly
attach the "ShareMail" widget when the screen is loaded to the "finished" page.

Indeed, as the survey form loads and replaces its content in AJAX rather than
fully reloading the page, we need to watch for the screen refresh and then
manually attach the widget so that the button handler is functional.

During FW to 16.4, we also fixed a small oversight of:
odoo/odoo@e0257347a7

Where we did not correctly add the "email_sharing" parameter when sharing the
certification content in the success screen.

Task-3360175

closes odoo/odoo#130613

X-original-commit: 337762b864d7b06abd7d1622083c5f00d7c7e7f7
Signed-off-by: Thibault Delavallee (tde) <tde@openerp.com>
Signed-off-by: Warnon Aurélien (awa) <awa@odoo.com>

addons/test_website_slides_full/static/tests/tours/slides_certification_member.js

@@ -120,6 +120,18 @@ var certificationCompletionSteps = [{
     content: 'Survey: check certification successful',
     trigger: 'div:contains("Congratulations, you have passed the test")',
     run: function () {}
+}, { // Sharing the certification
+    trigger: 'a:contains("Share your certification")'
+}, {
+    trigger: '.oe_slide_js_share_email input',
+    run: 'text friend@example.com'
+}, {
+    trigger: '.oe_slide_js_share_email button',
+}, {
+    trigger: '.oe_slide_js_share_email .alert:not(.d-none):contains("Sharing is caring")',
+    run: function () {}  // check email has been sent
+}, {
+    trigger: 'button.btn-close',  // close sharing modal
 }, {
     content: 'Survey: back to course home page',
     trigger: 'a:contains("Go back to course")'

addons/website_slides/static/src/js/slides_share.js

@@ -4,7 +4,7 @@ import publicWidget from '@web/legacy/js/public/public_widget';
 import '@website_slides/js/slides';
 import { _t } from "@web/legacy/js/services/core";
 
-var ShareMail = publicWidget.Widget.extend({
+export const ShareMail = publicWidget.Widget.extend({
     events: {
         'click button': '_sendMail',
         'keypress input': '_onKeypress',
@@ -160,3 +160,6 @@ publicWidget.registry.websiteSlidesEmbedShare = publicWidget.Widget.extend({
         })
     },
 });
+
+export const WebsiteSlidesShare = publicWidget.registry.websiteSlidesShare;
+export const WebsiteSlidesEmbedShare = publicWidget.registry.websiteSlidesEmbedShare;

addons/website_slides/views/website_slides_templates_utils.xml

@@ -39,7 +39,7 @@
 <template id='slide_social_email' name="Share by Email">
     <h5 class="mt-4">Share by Email</h5>
     <div t-if="not is_public_user">
-        <form class="oe_slide_js_share_email" role="form">
+        <div class="oe_slide_js_share_email">
             <div class="input-group">
                 <input type="text" class="form-control" placeholder="your-friend@domain.com, your-friend2@domain.com"/>
                 <button class="btn btn-primary" type="button"
@@ -54,7 +54,7 @@
                 <strong>Sharing is caring!</strong> Email(s) sent.
             </div>
             <div class="alert alert-warning d-none" role="alert">Please enter valid email(s)</div>
-        </form>
+        </div>
     </div>
     <div t-if="is_public_user" class="alert alert-info d-inline-block">
         <p class="mb-0">Please <a t-attf-href="/web?redirect=#{request.httprequest.url}" class="fw-bold"> login </a> to share this

addons/website_slides_survey/__manifest__.py

@@ -41,6 +41,7 @@
             'website_slides_survey/static/src/xml/website_slides_fullscreen.xml',
         ],
         'survey.survey_assets': [
+            'website_slides_survey/static/src/js/survey_form.js',
             'website_slides_survey/static/src/scss/website_slides_survey_result.scss',
         ],
     },

addons/website_slides_survey/static/src/js/survey_form.js

@@ -0,0 +1,12 @@
+/** @odoo-module **/
+
+import { ShareMail } from '@website_slides/js/slides_share';
+import SurveyFormWidget from '@survey/js/survey_form';
+
+SurveyFormWidget.include({
+    _onNextScreenDone(options) {
+        this._super(...arguments);
+
+        new ShareMail(this).attachTo($('.oe_slide_js_share_email'));
+    }
+});

addons/website_slides_survey/views/survey_templates.xml

@@ -10,6 +10,7 @@
                     </a>
                     <t t-call="website_slides.slide_share_modal">
                         <t t-set="record" t-value="channel_id"/>
+                        <t t-set="email_sharing" t-value="channel_id.share_channel_template_id"/>
                     </t>
                 </t>
             </xpath>