OfficeDev / office-js

A repo and NPM package for Office.js, corresponding to a copy of what gets published to the official "evergreen" Office.js CDN, at https://appsforoffice.microsoft.com/lib/1/hosted/office.js.
https://learn.microsoft.com/javascript/api/overview
Other
688 stars 94 forks source link

Cannot swap images in PowerPoint Online properly (MSFT - report from premier customer) #3500

Closed BruceEx closed 7 months ago

BruceEx commented 1 year ago

Message from office-js bot: We’re closing this issue because it has been inactive for a long time. We’re doing this to keep the issues list manageable and useful for everyone. If this issue is still relevant for you, please create a new issue. Thank you for your understanding and continued feedback.

Environment

PowerPoint Online 16.0.16614.40524 (Microsoft 365) Edge Version 114.0.1823.43 (Official build) (64-bit)

Issue

We use below code to swap size & location of pictures in the slide:

$("#run").click(() => tryCatch(run));

function run() { // This function gets the collection of shapes on the first slide, // and adds a text box to the collection, while specifying its text, // location, and size. Then it names the text box. return PowerPoint.run(async (context) => { context.presentation.load("slides"); await context.sync(); const slide1 = context.presentation.slides.getItemAt(0); slide1.load("shapes"); await context.sync(); const shapes = slide1.shapes; const shape1 = shapes.getItemAt(0); const shape2 = shapes.getItemAt(1); shape1.load("top,left,width,height"); shape2.load("top,left,width,height"); await context.sync(); const [itemA, itemB] = shapes.items.map((item) => item.name);

// Get itemA properties const { top: itemATop, left: itemALeft, width: itemAWidth, height: itemAHeight } = shape1; const { top: itemBTop, left: itemBLeft, width: itemBWidth, height: itemBHeight } = shape2;

// Swap size shape1.top = itemBTop; shape1.left = itemBLeft; shape1.width = itemBWidth; shape1.height = itemBHeight;

shape2.top = itemATop; shape2.left = itemALeft; shape2.width = itemAWidth; shape2.height = itemAHeight;

return context.sync(); }); }

/* Default helper for invoking an action and handling errors. / async function tryCatch(callback) { try { await callback(); } catch (error) { // Note: In a production add-in, you'd want to notify the user through your add-in's UI. console.error(error); } }

However, it doesn't work properly in PowerPoint Online. In PowerPoint desktop (M365) it is working fine.

In PPT online, before we run the code, we have images as below:

image

After we run the code, the display is wrong and conflict between slide preview (preview is correct) and slide:

image

We have opened an issue to Script Lab: https://github.com/OfficeDev/script-lab/issues/1010

Directly contact me tinga@microsoft.com if you have any question.

Thank you for taking the time to report an issue. Our triage team will respond to you in less than 72 hours. Normally, response time is <10 hours Monday through Friday. We do not triage on weekends.

xuruiyao-msft commented 1 year ago

@BruceEx I tried this piece of code on ppt online. I find that the position/width/height succeed to swap as shown in below picture. I am using shapes inserted from ppt manually. Did I miss something to reproduce this issue? Thanks for reaching out to us. image image

xuruiyao-msft commented 1 year ago

I find that if the two are type of picture, it's wierd after swapping these two pictures. image image

xuruiyao-msft commented 1 year ago

@BruceEx We have created a work item 8110947 to track this issue. Any progress, we'll sync with you. Thanks for reporting it to us.

BruceEx commented 1 year ago

@xuruiyao-msft yes, the issue only happens for images on PPT online.