From 067e36b5a2311f618286ada8b16794e675f54b70 Mon Sep 17 00:00:00 2001 From: Emmett Lalish Date: Tue, 8 Jun 2021 11:04:34 -0700 Subject: [PATCH] Minor code cleanup (#2459) * removed offscreen canvas vestage * cleanup conversions * added missing semicolons * added missing s * clean up RE * deflake space-opera tests --- packages/model-viewer/src/constants.ts | 7 --- .../model-viewer/src/model-viewer-base.ts | 2 +- .../model-viewer/src/styles/conversions.ts | 10 ++-- packages/model-viewer/src/styles/parsers.ts | 2 +- .../test/three-components/Renderer-spec.ts | 25 ++++----- .../src/three-components/ARRenderer.ts | 2 +- .../src/three-components/ModelScene.ts | 7 +-- .../src/three-components/Renderer.ts | 51 +++++++------------ packages/model-viewer/src/utilities.ts | 4 +- .../src/artifact-creator.ts | 4 +- packages/render-fidelity-tools/src/common.ts | 6 +-- .../src/components/renderer-harness.ts | 2 +- .../components/renderers/filament-viewer.ts | 4 +- .../src/workflows/update-screenshots.ts | 42 +++++++-------- .../src/components/config/reducer.ts | 2 +- .../materials_panel/material_state.ts | 5 +- .../src/components/materials_panel/reducer.ts | 2 +- .../src/components/mobile_view/mobile_view.ts | 3 +- .../mobile_view/open_mobile_view.ts | 4 +- .../components/download_button.ts | 2 +- .../components/open_button.ts | 3 +- .../materials_panel/materials_panel_test.ts | 7 ++- 22 files changed, 83 insertions(+), 113 deletions(-) diff --git a/packages/model-viewer/src/constants.ts b/packages/model-viewer/src/constants.ts index ffd0e0c31f..71c66ef52d 100644 --- a/packages/model-viewer/src/constants.ts +++ b/packages/model-viewer/src/constants.ts @@ -44,13 +44,6 @@ export const IS_MOBILE = (() => { export const IS_CHROMEOS = /\bCrOS\b/.test(navigator.userAgent); -// Disabling offscreen canvas for now because it is slower and has bugs relating -// to janky updates and out of sync frames. -export const USE_OFFSCREEN_CANVAS = false; -// Boolean((self as any).OffscreenCanvas) && -// Boolean((self as any).OffscreenCanvas.prototype.transferToImageBitmap) && -// !IS_CHROMEOS; // TODO(elalish): file a bug on inverted renders - export const IS_ANDROID = /android/i.test(navigator.userAgent); // Prior to iOS 13, detecting iOS Safari was relatively straight-forward. diff --git a/packages/model-viewer/src/model-viewer-base.ts b/packages/model-viewer/src/model-viewer-base.ts index e74efac406..4667cc8f00 100644 --- a/packages/model-viewer/src/model-viewer-base.ts +++ b/packages/model-viewer/src/model-viewer-base.ts @@ -454,7 +454,7 @@ export default class ModelViewerElementBase extends UpdatingElement { resolve(blob); }, mimeType, qualityArgument); - }) + }); } finally { this[$updateSize]({width, height}); }; diff --git a/packages/model-viewer/src/styles/conversions.ts b/packages/model-viewer/src/styles/conversions.ts index 39f36b8aa8..8aa945d5cc 100644 --- a/packages/model-viewer/src/styles/conversions.ts +++ b/packages/model-viewer/src/styles/conversions.ts @@ -125,13 +125,13 @@ export const normalizeUnit = (() => { }; return (node: NumberNode, fallback: NumberNode = ZERO) => { - let {number, unit} = node; - - if (!isFinite(number)) { - number = fallback.number; - unit = fallback.unit; + if (!isFinite(node.number)) { + node.number = fallback.number; + node.unit = fallback.unit; } + const {unit} = node; + if (unit == null) { return node; } diff --git a/packages/model-viewer/src/styles/parsers.ts b/packages/model-viewer/src/styles/parsers.ts index 3308b75758..c53d54ee52 100644 --- a/packages/model-viewer/src/styles/parsers.ts +++ b/packages/model-viewer/src/styles/parsers.ts @@ -203,7 +203,7 @@ const parseExpression = (() => { * An ident is something like a function name or the keyword "auto". */ const parseIdent = (() => { - const NOT_IDENT_RE = /[^a-z^0-9^_^\-^\u0240-\uffff]/i; + const NOT_IDENT_RE = /[^a-z0-9_\-\u0240-\uffff]/i; return (inputString: string): ParseResult => { const match = inputString.match(NOT_IDENT_RE); diff --git a/packages/model-viewer/src/test/three-components/Renderer-spec.ts b/packages/model-viewer/src/test/three-components/Renderer-spec.ts index b612f640d4..b40f2d8548 100644 --- a/packages/model-viewer/src/test/three-components/Renderer-spec.ts +++ b/packages/model-viewer/src/test/three-components/Renderer-spec.ts @@ -13,7 +13,6 @@ * limitations under the License. */ -import {USE_OFFSCREEN_CANVAS} from '../../constants.js'; import {$controls} from '../../features/controls.js'; import {$intersectionObserver, $isElementInViewport, $onResize, $renderer, $scene, Camera, RendererInterface} from '../../model-viewer-base.js'; import {ModelViewerElement} from '../../model-viewer.js'; @@ -189,7 +188,7 @@ suite('Renderer with two scenes', () => { test('uses the proper canvas when unregsitering scenes', () => { renderer.render(performance.now()); - expect(renderer.canvasElement.classList.contains('show')) + expect(renderer.canvas3D.classList.contains('show')) .to.be.eq( false, 'webgl canvas should not be shown with multiple scenes.'); expect(scene.canvas.classList.contains('show')) @@ -201,20 +200,14 @@ suite('Renderer with two scenes', () => { renderer.unregisterScene(scene); renderer.render(performance.now()); - if (USE_OFFSCREEN_CANVAS) { - expect(renderer.canvasElement.classList.contains('show')) - .to.be.eq(false); - expect(otherScene.canvas.classList.contains('show')).to.be.eq(true); - } else { - expect(renderer.canvasElement.parentElement) - .to.be.eq(otherScene.canvas.parentElement); - expect(renderer.canvasElement.classList.contains('show')) - .to.be.eq(true, 'webgl canvas should be shown with single scene.'); - expect(otherScene.canvas.classList.contains('show')) - .to.be.eq( - false, - 'otherScene canvas should not be shown when it is the only scene.'); - } + expect(renderer.canvas3D.parentElement) + .to.be.eq(otherScene.canvas.parentElement); + expect(renderer.canvas3D.classList.contains('show')) + .to.be.eq(true, 'webgl canvas should be shown with single scene.'); + expect(otherScene.canvas.classList.contains('show')) + .to.be.eq( + false, + 'otherScene canvas should not be shown when it is the only scene.'); }); suite('when resizing', () => { diff --git a/packages/model-viewer/src/three-components/ARRenderer.ts b/packages/model-viewer/src/three-components/ARRenderer.ts index 25bf5fb1b3..93aa057f9d 100644 --- a/packages/model-viewer/src/three-components/ARRenderer.ts +++ b/packages/model-viewer/src/three-components/ARRenderer.ts @@ -66,7 +66,7 @@ export type ARTracking = 'tracking'|'not-tracking'; export const ARTracking: {[index: string]: ARTracking} = { TRACKING: 'tracking', NOT_TRACKING: 'not-tracking' -} +}; export interface ARTrackingEvent extends ThreeEvent { status: ARTracking, diff --git a/packages/model-viewer/src/three-components/ModelScene.ts b/packages/model-viewer/src/three-components/ModelScene.ts index 286ce36efc..551e23f1c8 100644 --- a/packages/model-viewer/src/three-components/ModelScene.ts +++ b/packages/model-viewer/src/three-components/ModelScene.ts @@ -16,7 +16,6 @@ import {AnimationAction, AnimationClip, AnimationMixer, Box3, Event as ThreeEvent, Matrix3, Object3D, PerspectiveCamera, Raycaster, Scene, Vector2, Vector3} from 'three'; import {CSS2DRenderer} from 'three/examples/jsm/renderers/CSS2DRenderer'; -import {USE_OFFSCREEN_CANVAS} from '../constants.js'; import ModelViewerElementBase, {$renderer, RendererInterface} from '../model-viewer-base.js'; import {resolveDpr} from '../utilities.js'; @@ -148,11 +147,7 @@ export class ModelScene extends Scene { * there are more than one. */ createContext() { - if (USE_OFFSCREEN_CANVAS) { - this.context = this.canvas.getContext('bitmaprenderer')!; - } else { - this.context = this.canvas.getContext('2d')!; - } + this.context = this.canvas.getContext('2d')!; } /** diff --git a/packages/model-viewer/src/three-components/Renderer.ts b/packages/model-viewer/src/three-components/Renderer.ts index 2bf4e03d43..efbe5b97ad 100644 --- a/packages/model-viewer/src/three-components/Renderer.ts +++ b/packages/model-viewer/src/three-components/Renderer.ts @@ -16,7 +16,6 @@ import {ACESFilmicToneMapping, Event, EventDispatcher, GammaEncoding, PCFSoftShadowMap, WebGLRenderer} from 'three'; import {RoughnessMipmapper} from 'three/examples/jsm/utils/RoughnessMipmapper'; -import {USE_OFFSCREEN_CANVAS} from '../constants.js'; import {$canvas, $tick, $updateSize} from '../model-viewer-base.js'; import {clamp, isDebugMode, resolveDpr} from '../utilities.js'; @@ -68,8 +67,7 @@ export class Renderer extends EventDispatcher { } public threeRenderer!: WebGLRenderer; - public canvasElement: HTMLCanvasElement; - public canvas3D: HTMLCanvasElement|OffscreenCanvas; + public canvas3D: HTMLCanvasElement; public textureUtils: TextureUtils|null; public arRenderer: ARRenderer; public roughnessMipmapper: RoughnessMipmapper; @@ -111,13 +109,8 @@ export class Renderer extends EventDispatcher { this.dpr = resolveDpr(); - this.canvasElement = document.createElement('canvas'); - this.canvasElement.id = 'webgl-canvas'; - - this.canvas3D = USE_OFFSCREEN_CANVAS ? - this.canvasElement.transferControlToOffscreen() : - this.canvasElement; - + this.canvas3D = document.createElement('canvas'); + this.canvas3D.id = 'webgl-canvas'; this.canvas3D.addEventListener('webglcontextlost', this.onWebGLContextLost); try { @@ -199,8 +192,8 @@ export class Renderer extends EventDispatcher { const heightCSS = height / scale; // The canvas element must by styled outside of three due to the offscreen // canvas not being directly stylable. - this.canvasElement.style.width = `${widthCSS}px`; - this.canvasElement.style.height = `${heightCSS}px`; + this.canvas3D.style.width = `${widthCSS}px`; + this.canvas3D.style.height = `${heightCSS}px`; // Each scene's canvas must match the renderer size. In general they can be // larger than the element that contains them, but the overflow is hidden @@ -235,8 +228,8 @@ export class Renderer extends EventDispatcher { const width = this.width / scale; const height = this.height / scale; - this.canvasElement.style.width = `${width}px`; - this.canvasElement.style.height = `${height}px`; + this.canvas3D.style.width = `${width}px`; + this.canvas3D.style.height = `${height}px`; for (const scene of this.scenes) { const {style} = scene.canvas; style.width = `${width}px`; @@ -284,8 +277,7 @@ export class Renderer extends EventDispatcher { } displayCanvas(scene: ModelScene): HTMLCanvasElement { - return this.multipleScenesVisible ? scene.element[$canvas] : - this.canvasElement; + return this.multipleScenesVisible ? scene.element[$canvas] : this.canvas3D; } /** @@ -307,18 +299,18 @@ export class Renderer extends EventDispatcher { if (visibleCanvas == null) { return; } - const multipleScenesVisible = visibleScenes > 1 || USE_OFFSCREEN_CANVAS; - const {canvasElement} = this; + const multipleScenesVisible = visibleScenes > 1; + const {canvas3D} = this; if (multipleScenesVisible === this.multipleScenesVisible && (multipleScenesVisible || - canvasElement.parentElement === visibleCanvas.parentElement)) { + canvas3D.parentElement === visibleCanvas.parentElement)) { return; } this.multipleScenesVisible = multipleScenesVisible; if (multipleScenesVisible) { - canvasElement.classList.remove('show'); + canvas3D.classList.remove('show'); } for (const scene of this.scenes) { if (scene.externalRenderer != null) { @@ -329,8 +321,8 @@ export class Renderer extends EventDispatcher { canvas.classList.add('show'); scene.isDirty = true; } else if (scene.canvas === visibleCanvas) { - scene.canvas.parentElement!.appendChild(canvasElement); - canvasElement.classList.add('show'); + scene.canvas.parentElement!.appendChild(canvas3D); + canvas3D.classList.add('show'); canvas.classList.remove('show'); scene.isDirty = true; } @@ -456,17 +448,10 @@ export class Renderer extends EventDispatcher { if (scene.context == null) { scene.createContext(); } - if (USE_OFFSCREEN_CANVAS) { - const contextBitmap = scene.context as ImageBitmapRenderingContext; - const bitmap = - (this.canvas3D as OffscreenCanvas).transferToImageBitmap(); - contextBitmap.transferFromImageBitmap(bitmap); - } else { - const context2D = scene.context as CanvasRenderingContext2D; - context2D.clearRect(0, 0, width, height); - context2D.drawImage( - this.canvas3D, 0, 0, width, height, 0, 0, width, height); - } + const context2D = scene.context as CanvasRenderingContext2D; + context2D.clearRect(0, 0, width, height); + context2D.drawImage( + this.canvas3D, 0, 0, width, height, 0, 0, width, height); } scene.isDirty = false; diff --git a/packages/model-viewer/src/utilities.ts b/packages/model-viewer/src/utilities.ts index 801fbfabd5..721211f8e3 100644 --- a/packages/model-viewer/src/utilities.ts +++ b/packages/model-viewer/src/utilities.ts @@ -14,6 +14,7 @@ */ import {EventDispatcher} from 'three'; + import {HAS_WEBXR_DEVICE_API, HAS_WEBXR_HIT_TEST_API, IS_WEBXR_AR_CANDIDATE} from './constants.js'; export type Constructor = { @@ -189,8 +190,7 @@ export const resolveDpr: () => number = (() => { */ export const isDebugMode = (() => { const debugQueryParameterName = 'model-viewer-debug-mode'; - const debugQueryParameter = - new RegExp(`[\?&]${debugQueryParameterName}(&|$)`); + const debugQueryParameter = new RegExp(`[?&]${debugQueryParameterName}(&|$)`); return () => ((self as any).ModelViewerElement && (self as any).ModelViewerElement.debugMode) || diff --git a/packages/render-fidelity-tools/src/artifact-creator.ts b/packages/render-fidelity-tools/src/artifact-creator.ts index 6733e3db2a..b747eb732c 100644 --- a/packages/render-fidelity-tools/src/artifact-creator.ts +++ b/packages/render-fidelity-tools/src/artifact-creator.ts @@ -158,7 +158,7 @@ export class ArtifactCreator { if (rmsInDb > FIDELITY_TEST_THRESHOLD) { if (exclude?.includes('model-viewer')) { console.log(`❌ Skipped! Senario name: ${ - scenario.name}, rms distance ratio: ${rmsInDb.toFixed(2)} dB.`) + scenario.name}, rms distance ratio: ${rmsInDb.toFixed(2)} dB.`); } else { throw new Error(`❌ Senarios name: ${ scenario.name}, rms distance ratio: ${rmsInDb.toFixed(2)} dB.`); @@ -305,7 +305,7 @@ export class ArtifactCreator { // currently has no mechanism to detect this and will happily tell you // your code is correct when it isn't. const evaluateError = await page.evaluate(async (maxTimeInSec) => { - const modelBecomesReady = new Promise((resolve, reject) => { + const modelBecomesReady = new Promise((resolve, reject) => { let timeout: NodeJS.Timeout; if (maxTimeInSec > 0) { timeout = setTimeout(() => { diff --git a/packages/render-fidelity-tools/src/common.ts b/packages/render-fidelity-tools/src/common.ts index 3665c6d5a2..342763951f 100644 --- a/packages/render-fidelity-tools/src/common.ts +++ b/packages/render-fidelity-tools/src/common.ts @@ -221,10 +221,8 @@ export class ImageComparator { } return { - imageBuffers: { - delta: deltaImage ? deltaImage.buffer : null, - blackWhite: blackWhiteImage ? blackWhiteImage.buffer : null - } + imageBuffers: + {delta: deltaImage.buffer, blackWhite: blackWhiteImage.buffer} }; } diff --git a/packages/render-fidelity-tools/src/components/renderer-harness.ts b/packages/render-fidelity-tools/src/components/renderer-harness.ts index 65ea050026..507c338753 100644 --- a/packages/render-fidelity-tools/src/components/renderer-harness.ts +++ b/packages/render-fidelity-tools/src/components/renderer-harness.ts @@ -58,7 +58,7 @@ export class RendererConfiguration extends LitElement { if (this.configUrl == null) { this.config = null; } else { - this.config = await (await fetch(this.configUrl)).json() + this.config = await (await fetch(this.configUrl)).json(); } } diff --git a/packages/render-fidelity-tools/src/components/renderers/filament-viewer.ts b/packages/render-fidelity-tools/src/components/renderers/filament-viewer.ts index 0f142c99bf..ccc5068c3d 100644 --- a/packages/render-fidelity-tools/src/components/renderers/filament-viewer.ts +++ b/packages/render-fidelity-tools/src/components/renderers/filament-viewer.ts @@ -218,7 +218,7 @@ export class FilamentViewer extends LitElement { await fetchFilamentAssets([iblUrl, skyboxUrl]); const ibl = this[$engine].createIblFromKtx(iblUrl); this[$scene].setIndirectLight(ibl); - this[$ibl] = ibl + this[$ibl] = ibl; ibl.setIntensity(1.0); ibl.setRotation([0, 0, -1, 0, 1, 0, 1, 0, 0]); // 90 degrees @@ -243,7 +243,7 @@ export class FilamentViewer extends LitElement { const asset = this[$currentAsset]!; - await new Promise((resolve) => { + await new Promise((resolve) => { console.log('Loading resources for', modelUrl); asset.loadResources(resolve, () => {}, basepath(modelUrl), 1); }); diff --git a/packages/render-fidelity-tools/src/workflows/update-screenshots.ts b/packages/render-fidelity-tools/src/workflows/update-screenshots.ts index c73a32b8d1..9ea81483ca 100644 --- a/packages/render-fidelity-tools/src/workflows/update-screenshots.ts +++ b/packages/render-fidelity-tools/src/workflows/update-screenshots.ts @@ -20,6 +20,7 @@ import {dirname, join, resolve} from 'path'; import {ImageComparisonConfig} from '../common.js'; import {ConfigReader} from '../config-reader.js'; + import {rendererScreenshot} from './update-screenshots/renderer-screenshot.js'; const require = module.createRequire(import.meta.url); @@ -36,7 +37,7 @@ const config = require(configPath); const {renderers} = config; const goldensDirectory = join(rootDirectory, 'goldens'); -const renderersDirectory = join(rootDirectory, 'renderers') +const renderersDirectory = join(rootDirectory, 'renderers'); let scenarioWhitelist: Set|null = null; let rendererWhitelist: Set|null = null; @@ -68,25 +69,26 @@ const run = async ( command: string, args: Array, environmentVariables = {}, - workingDirectory = process.cwd()) => new Promise((resolve, reject) => { - const childProcess = spawn(command, args, { - cwd: workingDirectory, - env: {...process.env, ...environmentVariables}, - stdio: ['ignore', 'inherit', 'inherit'] - }); - - childProcess.once('error', (error: any) => { - warn(error); - }); - - childProcess.once('exit', (code) => { - if (code === 0) { - resolve(); - } else { - reject(new Error('Command failed')); - } - }); -}); + workingDirectory = process.cwd()) => + new Promise((resolve, reject) => { + const childProcess = spawn(command, args, { + cwd: workingDirectory, + env: {...process.env, ...environmentVariables}, + stdio: ['ignore', 'inherit', 'inherit'] + }); + + childProcess.once('error', (error: any) => { + warn(error); + }); + + childProcess.once('exit', (code) => { + if (code === 0) { + resolve(); + } else { + reject(new Error('Command failed')); + } + }); + }); const updateScreenshots = async (config: ImageComparisonConfig) => { const {scenarios} = config; diff --git a/packages/space-opera/src/components/config/reducer.ts b/packages/space-opera/src/components/config/reducer.ts index c4dce06977..e1e3b1b2ca 100644 --- a/packages/space-opera/src/components/config/reducer.ts +++ b/packages/space-opera/src/components/config/reducer.ts @@ -86,7 +86,7 @@ export function dispatchSetReveal(reveal?: string) { return {type: SET_REVEAL, payload: reveal}; } -const SET_CONFIG = 'SET_CONFIG' +const SET_CONFIG = 'SET_CONFIG'; export function dispatchSetConfig(config: ModelViewerConfig) { return {type: SET_CONFIG, payload: config}; } diff --git a/packages/space-opera/src/components/materials_panel/material_state.ts b/packages/space-opera/src/components/materials_panel/material_state.ts index a3b5ed21e2..0544f935b9 100644 --- a/packages/space-opera/src/components/materials_panel/material_state.ts +++ b/packages/space-opera/src/components/materials_panel/material_state.ts @@ -347,13 +347,14 @@ class TextureHandleCache { const cachedHandle = this.textureHandlesById.get(texId); // Handles may become invalid if they were garbage collected, so check // that. - if (cachedHandle && isTextureHandleValid(this.model, cachedHandle)) { + if (cachedHandle && await isTextureHandleValid(this.model, cachedHandle)) { finalHandle = cachedHandle; } else { // Set by content and get new handle. finalHandle = await createNewHandle(); } - if (!finalHandle || !isTextureHandleValid(this.model, finalHandle)) { + if (!finalHandle || + !(await isTextureHandleValid(this.model, finalHandle))) { throw new Error(`Could not get a valid handle for texId ${texId}`); } this.textureHandlesById.set(texId, finalHandle); diff --git a/packages/space-opera/src/components/materials_panel/reducer.ts b/packages/space-opera/src/components/materials_panel/reducer.ts index 47c43eb06a..975d6c2d0e 100644 --- a/packages/space-opera/src/components/materials_panel/reducer.ts +++ b/packages/space-opera/src/components/materials_panel/reducer.ts @@ -455,7 +455,7 @@ export function editsReducer( // Orig Edits ////////////// -const SET_ORIG_EDITS = 'SET_ORIG_EDITS' +const SET_ORIG_EDITS = 'SET_ORIG_EDITS'; export function dispatchSetOrigEdits(origEdits: GltfEdits) { return {type: SET_ORIG_EDITS, payload: origEdits}; } diff --git a/packages/space-opera/src/components/mobile_view/mobile_view.ts b/packages/space-opera/src/components/mobile_view/mobile_view.ts index 0d9aa55af4..1de220e019 100644 --- a/packages/space-opera/src/components/mobile_view/mobile_view.ts +++ b/packages/space-opera/src/components/mobile_view/mobile_view.ts @@ -31,7 +31,6 @@ import {styles as hotspotStyles} from '../utils/hotspot/hotspot.css.js'; import {styles as mobileStyles} from './styles.css.js'; import {EditorUpdates, MobilePacket, MobileSession, URLs} from './types.js'; - import {envToSession, getMobileOperatingSystem, getPingUrl, getRandomInt, getSessionUrl, getWithTimeout, gltfToSession, post, prepareGlbBlob, usdzToSession} from './utils.js'; const TOAST_TIME = 7000; // 7s @@ -90,7 +89,7 @@ export class MobileView extends LitElement { [hotspot.position.x, hotspot.position.y, hotspot.position.z]); if (hotspot.normal) { hotspot.normal = - toVector3D([hotspot.normal.x, hotspot.normal.y, hotspot.normal.z]) + toVector3D([hotspot.normal.x, hotspot.normal.y, hotspot.normal.z]); } } diff --git a/packages/space-opera/src/components/mobile_view/open_mobile_view.ts b/packages/space-opera/src/components/mobile_view/open_mobile_view.ts index 158fb6e350..2abfa41203 100644 --- a/packages/space-opera/src/components/mobile_view/open_mobile_view.ts +++ b/packages/space-opera/src/components/mobile_view/open_mobile_view.ts @@ -18,8 +18,6 @@ import {GltfModel} from '@google/model-viewer-editing-adapter/lib/main'; import {createSafeObjectUrlFromArrayBuffer} from '@google/model-viewer-editing-adapter/lib/util/create_object_url'; import {customElement, html, internalProperty, query} from 'lit-element'; -// @ts-ignore, the qrious package isn't typed -import QRious from 'qrious'; import {reduxStore} from '../../space_opera_base.js'; import {openMobileViewStyles} from '../../styles.css.js'; @@ -31,8 +29,8 @@ import {getEdits} from '../materials_panel/reducer.js'; import {getGltfModel, getGltfUrl} from '../model_viewer_preview/reducer.js'; import {getModelViewerSnippet} from '../model_viewer_snippet/reducer.js'; import {dispatchSetIosName} from '../relative_file_paths/reducer.js'; -import {MobileModal} from './components/mobile_modal.js'; +import {MobileModal} from './components/mobile_modal.js'; import {dispatchAr, dispatchArModes, dispatchIosSrc, dispatchSetForcePost, dispatchSetRefreshable, getArConfig, getForcePost, getRefreshable} from './reducer.js'; import {EditorUpdates, MobilePacket, MobileSession, URLs} from './types.js'; import {envToSession, getPingUrl, getRandomInt, getSessionUrl, getWithTimeout, gltfToSession, post, prepareGlbBlob, prepareUSDZ, usdzToSession} from './utils.js'; diff --git a/packages/space-opera/src/components/model_viewer_snippet/components/download_button.ts b/packages/space-opera/src/components/model_viewer_snippet/components/download_button.ts index 62206a4b1f..bb503849a1 100644 --- a/packages/space-opera/src/components/model_viewer_snippet/components/download_button.ts +++ b/packages/space-opera/src/components/model_viewer_snippet/components/download_button.ts @@ -163,7 +163,7 @@ async function prepareZipArchive( // Replace placeholders in html strings with content template = template.replace('REPLACEME', snippet); - template = template.replace(/(^[ \t]*\n)/gm, '') // remove extra newlines + template = template.replace(/(^[ \t]*\n)/gm, ''); // remove extra newlines zip.file('index.html', template); // Keep model-viewer snippet diff --git a/packages/space-opera/src/components/model_viewer_snippet/components/open_button.ts b/packages/space-opera/src/components/model_viewer_snippet/components/open_button.ts index bea2fad54a..7d245057ec 100644 --- a/packages/space-opera/src/components/model_viewer_snippet/components/open_button.ts +++ b/packages/space-opera/src/components/model_viewer_snippet/components/open_button.ts @@ -39,6 +39,7 @@ import {SnippetViewer} from '../../shared/snippet_viewer/snippet_viewer.js'; import {renderModelViewer} from '../../utils/render_model_viewer.js'; import {parseHotspotsFromSnippet} from '../parse_hotspot_config.js'; import {applyRelativeFilePaths, dispatchConfig, dispatchExtraAttributes, getExtraAttributes} from '../reducer.js'; + import {parseExtraAttributes, parseSnippet, parseSnippetAr} from './parsing.js'; @customElement('me-open-modal') @@ -123,7 +124,7 @@ export class OpenModal extends ConnectedLitElement { reduxStore.dispatch(dispatchSetEnvironmentName(envImageName)); } else if (this.config.environmentImage) { // else, if there was an env image in the state, leave it alone - config.environmentImage = this.config.environmentImage + config.environmentImage = this.config.environmentImage; } else { // else, reset env image config.environmentImage = undefined; diff --git a/packages/space-opera/src/test/materials_panel/materials_panel_test.ts b/packages/space-opera/src/test/materials_panel/materials_panel_test.ts index 4c8d2b7ce7..e1c54c92f1 100644 --- a/packages/space-opera/src/test/materials_panel/materials_panel_test.ts +++ b/packages/space-opera/src/test/materials_panel/materials_panel_test.ts @@ -88,6 +88,7 @@ describe('material panel test', () => { }); it('reflects textures in GLTF', async () => { + panel.selectedMaterialId = 0; await panel.updateComplete; const actualTexturesById = panel.texturesById!.values().next().value; expect(actualTexturesById).toBeDefined(); @@ -156,9 +157,10 @@ describe('material panel test', () => { }); it('clears model textures on MR null texture input', async () => { - const texturePicker = panel.metallicRoughnessTexturePicker!; panel.selectedMaterialId = 1; await panel.updateComplete; + const texturePicker = panel.metallicRoughnessTexturePicker!; + await texturePicker.updateComplete; const clearTextureOption = texturePicker.shadowRoot!.querySelector('div#nullTextureSquare')!; @@ -193,6 +195,7 @@ describe('material panel test', () => { panel.selectedMaterialId = 1; await panel.updateComplete; const texturePicker = panel.normalTexturePicker!; + await texturePicker.updateComplete; const clearTextureOption = texturePicker.shadowRoot!.querySelector('div#nullTextureSquare')!; @@ -227,6 +230,7 @@ describe('material panel test', () => { panel.selectedMaterialId = 1; await panel.updateComplete; const texturePicker = panel.emissiveTexturePicker!; + await texturePicker.updateComplete; const clearTextureOption = texturePicker.shadowRoot!.querySelector('div#nullTextureSquare')!; @@ -261,6 +265,7 @@ describe('material panel test', () => { panel.selectedMaterialId = 1; await panel.updateComplete; const texturePicker = panel.occlusionTexturePicker!; + await texturePicker.updateComplete; const clearTextureOption = texturePicker.shadowRoot!.querySelector('div#nullTextureSquare')!;