[FIX] website: prevent traceback on countdown bg color reset

When the layout background color was reset using the colorpicker of the
countdown option, a traceback occurred. This was because the countdown
widget relies on having a set color. The text and progress bar colors
were working with unset colors but with inconsistent behavior. This
commit fixes the traceback and makes the widget consistent: using the
reset button on any color tells the countdown widget "use the color
you want" and our countdown widget will simply set it to black.

Thanks to @dwa-odoo and @jpr-odoo for original investigation.

task-2227149

closes odoo/odoo#61682

X-original-commit: abbf88770442bded27b5e490ce3d3e1a7025dc04
Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>

addons/website/static/src/snippets/s_countdown/000.js

@@ -13,6 +13,7 @@ const CountdownWidget = publicWidget.Widget.extend({
     selector: '.s_countdown',
     xmlDependencies: ['/website/static/src/snippets/s_countdown/000.xml'],
     disabledInEditableMode: false,
+    defaultColor: 'rgba(0, 0, 0, 255)',
 
     /**
      * @override
@@ -76,7 +77,7 @@ const CountdownWidget = publicWidget.Widget.extend({
         if (ColorpickerWidget.isCSSColor(color)) {
             return color;
         }
-        return weUtils.getCSSVariableValue(color);
+        return weUtils.getCSSVariableValue(color) || this.defaultColor;
     },
     /**
      * Gets the time difference in seconds between now and countdown due date.

addons/website/static/src/snippets/s_countdown/options.js

@@ -3,6 +3,7 @@ odoo.define('website.s_countdown_options', function (require) {
 
 const core = require('web.core');
 const snippetOptions = require('web_editor.snippets.options');
+const CountdownWidget = require('website.s_countdown');
 
 const qweb = core.qweb;
 
@@ -154,6 +155,16 @@ snippetOptions.registry.countdown = snippetOptions.SnippetOptionWidget.extend({
             case 'endAction':
             case 'layout':
                 return this.$target[0].dataset[methodName];
+
+            case 'selectDataAttribute': {
+                if (params.colorNames) {
+                    // In this case, it is a colorpicker controlling a data
+                    // value on the countdown: the default value is determined
+                    // by the countdown public widget.
+                    params.attributeDefaultValue = CountdownWidget.prototype.defaultColor;
+                }
+                break;
+            }
         }
         return this._super(...arguments);
     },