fix: video share link fixes (#32187)

* fix: remove outdated click handler in social share

* fix: reestablish blank target of social share link

* test: update js tests
This commit is contained in:
Nathan Sprenkle
2023-05-04 16:29:47 -04:00
committed by GitHub
parent af96cb1b21
commit 6307961ff6
3 changed files with 16 additions and 69 deletions

View File

@@ -1,37 +1,28 @@
(function() {
'use strict';
describe('VideoSocialSharingHandler', function() {
var state, spyOpen;
var state;
beforeEach(function() {
state = jasmine.initializePlayer('video_all.html');
spyOpen = spyOn(window, 'open').and.returnValue(null);
window.analytics = jasmine.createSpyObj('analytics', ['track'])
});
afterAll(() => delete window.analytics);
describe('clicking social share opens the correct URL', function() {
describe('clicking social share fires an analytics event', function() {
const testCases = [
{
source: 'twitter',
url: "https://twitter.com/intent/tweet?text=Here's%20a%20fun%20clip%20from%20a%20class%20I'm%20taking%20on%20%40edXonline.%0A%0A&url="
},
{ source: 'facebook', url: "https://www.facebook.com/sharer/sharer.php?u=" },
{ source: 'linkedin', url: 'https://www.linkedin.com/sharing/share-offsite/?url=' },
{ source: 'twitter' },
{ source: 'facebook' },
{ source: 'linkedin' },
];
_.each(testCases, ({ source, url }) => {
_.each(testCases, ({ source }) => {
it(source, () => {
var siteShareButton = $(`.social-share-link[data-source="${source}"]`);
expect(siteShareButton.length).toEqual(1);
siteShareButton.trigger('click');
expect(spyOpen).toHaveBeenCalledWith(
url + `video-share-url%3Futm_source%3D${source}%26utm_medium%3Dsocial%26utm_campaign%3Dsocial-share-exp`,
'targetWindow',
'toolbar=no,location=0,status=no,menubar=no,scrollbars=yes,resizable=yes,width=600,height=400'
);
expect(window.analytics.track).toHaveBeenCalledWith(
'edx.social.video.share_button.clicked',
{

View File

@@ -2,9 +2,10 @@
'use strict';
// VideoSocialSharingHandler module.
define(
'video/036_video_social_sharing.js', ['underscore', 'gettext'],
function(_, gettext) {
var VideoSocialSharingHandler, SocialSharingSite, SimpleSocialSharingSite, facebook, linkedin, twitter;
'video/036_video_social_sharing.js', ['underscore'],
function(_) {
var VideoSocialSharingHandler;
/**
* Video Social Sharing control module.
* @exports video/036_video_social_sharing.js
@@ -29,6 +30,7 @@
};
VideoSocialSharingHandler.prototype = {
// Initializes the module.
initialize: function() {
this.el = this.container.find('.wrapper-social-share');
@@ -36,42 +38,16 @@
this.baseVideoUrl = this.el.data('url');
this.course_id = this.container.data('courseId');
this.block_id = this.container.data('blockId')
this.socialSharingSites = this.getSocialSharingSites()
},
// Fire an analytics event on share button click.
clickHandler: function(event) {
var self = this;
event.preventDefault();
var source = $(event.currentTarget).data('source')
var utmQuery = $.param({
utm_source: source,
utm_medium: 'social',
utm_campaign: 'social-share-exp',
});
var sharedVideoUrl = encodeURIComponent(self.baseVideoUrl + "?" + utmQuery);
var socialShareSite = self.socialSharingSites[source];
var socialMediaShareLinkUrl = socialShareSite.generateShareUrl(sharedVideoUrl);
window.open(
socialMediaShareLinkUrl,
'targetWindow',
'toolbar=no,location=0,status=no,menubar=no,scrollbars=yes,resizable=yes,width=600,height=400'
);
self.sendAnalyticsEvent(source);
},
getSocialSharingSites: function() {
var socialSharingSites = {},
socialSharingSitesList = [
twitter, facebook, linkedin
];
_.each(socialSharingSitesList, function(socialSharingSite) {
socialSharingSites[socialSharingSite.name] = socialSharingSite;
}, this);
return socialSharingSites;
},
// Send an analytics event for share button tracking.
sendAnalyticsEvent: function(source) {
window.analytics.track(
'edx.social.video.share_button.clicked',
@@ -84,28 +60,6 @@
}
};
// Define the social sharing sites and how they generate
// a link to their share page.
SocialSharingSite = function(name, generateShareUrl) {
// A social sharing site with a name and a function to generate a share URL
this.name = name;
this.generateShareUrl = generateShareUrl;
};
SimpleSocialSharingSite = function(name, baseShareUrl) {
// A social sharing site with a url that is a static string with the url appended
this.name = name;
this.generateShareUrl = (url) => baseShareUrl + url;
}
twitter = new SocialSharingSite(
'twitter',
url => {
var tweetText = encodeURIComponent(gettext("Here's a fun clip from a class I'm taking on @edXonline.\n\n"));
return "https://twitter.com/intent/tweet?text=" + tweetText + "&url=" + url;
}
);
facebook = new SimpleSocialSharingSite('facebook', 'https://www.facebook.com/sharer/sharer.php?u=');
linkedin = new SimpleSocialSharingSite('linkedin', 'https://www.linkedin.com/sharing/share-offsite/?url=');
return VideoSocialSharingHandler;
});
}(RequireJS.define));